gatsby-plugin-mini-css-class-name

    4.3.0 • Public • Published

    gatsby-plugin-mini-css-class-name

    npm version

    Minifying CSS class names if using CSS Modules.

    - <p class="post-module--text--w-3Tg">Hello</p>
    + <p class="a">Hello</p>

    Install

    npm i gatsby-plugin-mini-css-class-name
    #or
    yarn add gatsby-plugin-mini-css-class-name

    How to use

    // In your gatsby-config.js
    module.exports = {
      plugins: [`gatsby-plugin-mini-css-class-name`],
    }

    If you need to pass plugin options:

    // In your gatsby-config.js
    module.exports = {
      plugins: [
        {
          resolve: `gatsby-plugin-mini-css-class-name`,
          options: {
            prefix: `x-`,
          },
        },
      ],
    }

    ⚠️ This plugin must be the last plugin witch work with CSS in your gatsby-config.js. This plugin contributes change to Webpack config and other plugins can delete the changes.

    // In your gatsby-config.js
    module.exports = {
      plugins: [
        `gatsby-plugin-postcss`,
        `gatsby-plugin-mini-css-class-name`, // after PostCSS
      ],
    }

    Options

    Name Type Default Description
    prefix {String} "" A custom prefix will be added to each class name
    suffix {String} "" A custom suffix will be added to each class name
    excludePattern {RegExp} null A regular expression for removing characters

    mini-css-class-name

    License

    MIT

    Install

    npm i gatsby-plugin-mini-css-class-name

    DownloadsWeekly Downloads

    511

    Version

    4.3.0

    License

    MIT

    Unpacked Size

    5.73 kB

    Total Files

    5

    Last publish

    Collaborators

    • shoonia