Skip to content

Get your modernizr build bundled with webpack, use modernizr with webpack easily

License

Notifications You must be signed in to change notification settings

itgalaxy/webpack-modernizr-loader

Repository files navigation

webpack-modernizr-loader

NPM version Travis Build Status dependencies Status devDependencies Status

Get your modernizr build bundled with webpack.

Installation

$ npm install webpack-modernizr-loader --save-dev

Usage

Documentation: Using loaders

There are three use case.

  1. Using loader options.
const modernizr = require("modernizr");

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        loader: "webpack-modernizr-loader",
        options: {
          // Full list of supported options can be found in [config-all.json](https://github.com/Modernizr/Modernizr/blob/master/lib/config-all.json).
          options: ["setClasses"],
          "feature-detects": [
            "test/css/flexbox",
            "test/es6/promises",
            "test/serviceworker"
          ]
          // Uncomment this when you use `JSON` format for configuration
          // type: 'javascript/auto'
        },
        test: /empty-alias-file\.js$/
      }
    ]
  },
  resolve: {
    alias: {
      // You can add comment "Please do not delete this file" in this file
      modernizr$: path.resolve(__dirname, "/path/to/empty-alias-file.js")
    }
  }
};
  1. Using config file through alias (supported JavaScript and JSON syntax).
const modernizr = require("modernizr");

.modernizrrc.js

module.exports = {
  options: ["setClasses"],
  "feature-detects": [
    "test/css/flexbox",
    "test/es6/promises",
    "test/serviceworker"
  ]
};

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        loader: "webpack-modernizr-loader",
        test: /\.modernizrrc\.js$/
        // Uncomment this when you use `JSON` format for configuration
        // type: 'javascript/auto'
      }
    ]
  },
  resolve: {
    alias: {
      modernizr$: path.resolve(__dirname, "/path/to/.modernizrrc.js")
    }
  }
};
  1. Using config (supported JavaScript and JSON syntax) file directly (see below example how it is use).
const modernizr = require("modernizr");

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        loader: "webpack-modernizr-loader",
        test: /\.modernizrrc\.js$/
        // Uncomment this when you use `JSON` format for configuration
        // type: 'javascript/auto'
      }
    ]
  }
};

Related

Contribution

Feel free to push your code if you agree with publishing under the MIT license.