parcel-resolver-modernizr

parcel-resolver-modernizr

A Parcel resolver for custom Modernizr builds, migrate/inspired in parcel-plugin-modernizr

Installation

Using NPM

$ npm install parcel-resolver-modernizr -D

This plugins needs Modernizr to be installed in your project devDependencies

Setup

1. Create a file modernizr-config.json (you can also use .modernizrrc) in your project root folder with your desired Modernizr configuration. You can also use Modernizr to generate a custom configuration for your project.

2. Include "parcel-resolver-modernizr" in your .parcelrc config file, remember to add all the resolvers previously configured

{
  "extends": "@parcel/config-default",
  "resolvers": ["parcel-resolver-modernizr", "..."]
}

Usage: Embedded in html

This option is similar to parcel-plugin-modernizr usage option 1. Where you can include the "modernizr.js" js module in your index.html file

./src/index.html:

<script type="module" src="modernizr.js"></script>

./src/modernizr-config.json: Your modernizr config

$ parcel ./src/index.html

Output

1. ./dist/index.html:

   <script src="modernizr.contentHash.js"></script>

2. ./dist/index.contentHash.js: Your custom modernizr build

Usage: Imported as a ESM module

You can also retrieve Modernizr as a ESM module in your js/ts code using an import statement.

./src/main.tsx:

import Modernizr from "modernizr";
...
const batteryEnabled = Modernizr.batteryapi;

Limitations

1. package.json option is currently unavailiable
2. resource names 'modernizr.js' and 'modernizr' are not configurable

Contributing

Pull requests are welcome!