Notorious Party Muppets

    postcss-amplify-webpack-plugin

    1.0.0 • Public • Published

    postcss-amplify-webpack-plugin

    Travis npm package

    A Webpack plugin to generate a Google AMP optimized CSS file using postcss-amplify.

    For every CSS file that is compiled through Webpack, this plugin uses postcss-amplify to filter out:

    • Media queries for desktop breakpoints
    • Non -webkit- vendor prefixes
    • Specific class block names or other prefixes (for use with BEM or other namespacing methodologies)
    • !important flags
    • -amp classes or i-amp tags

    and generate a new file with the format FILENAME.amp.css.

    Installation

    NPM

    npm install postcss-amplify-webpack-plugin
    

    Yarn

    yarn add postcss-amplify-webpack-plugin
    

    Usage

    Add the plugin to your Webpack config:

    const PostcssAmplifyWebpackPlugin = require('postcss-amplify-webpack-plugin');
    
    module.exports = {
      ...
      plugins: [
        new PostcssAmplifyWebpackPlugin(options)
      ]
    };
    

    Options

    options.maxBreakpoint (string) To allow for larger mobile styling, media queries below this breakpoint will be preserved.

    options.excludedBlocks (string or array) List of class blocks or prefixes to exclude. Do not include the ..

    options.outputPath (string) Directory for the new files. This should be an absolute path and defaults to the setting for output.path in the Webpack config.

    options.excludedFiles (RegExp or array) List of files to exclude. This option behaves the same as other Webpack exclude conditions.

    Issues

    My Webpack configs tend to be on the simpler side so it's possible there are some build variations I haven't considered. If you run into any issues with the plugin or the underlying CSS parsing, please submit an issue.

    License

    MIT

    Install

    npm i postcss-amplify-webpack-plugin

    DownloadsWeekly Downloads

    5

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    7.32 kB

    Total Files

    4

    Last publish

    Collaborators

    • laurenashpole