addon-postcss icon indicating copy to clipboard operation
addon-postcss copied to clipboard

[Bug]

Open nathanredblur opened this issue 3 years ago • 0 comments

Describe the bug

I get this error

ModuleError: Module Error (from ../node_modules/@storybook/addon-postcss/node_modules/css-loader/dist/cjs.js):
options.mode must be either "global", "local" or "pure" (default "local")

when I set this configuration:

 addons: [
    {
      name: "@storybook/addon-postcss",
      options: {
        cssLoaderOptions: {
          importLoaders: 1,
          modules: {
            mode: (resourcePath) => {
              if (/\.module\.css$/i.test(resourcePath)) return "local";
              return "icss";
            },
          },
        },
        postcssLoaderOptions: {
          implementation: require("postcss"),
        },
      },
    },
  ],

but official documentation for css-loader https://github.com/webpack-contrib/css-loader#modules allows:

        | "local"
        | "global"
        | "pure"
        | "icss"

Steps to reproduce the behavior

run a project that use css.modules with the previous configuration

Expected behavior

no error happen and icss value is accepted.

Environment

  • OS: osx
  • Node.js version: v16.15.0
  • NPM version: 9.1.1
  • @storybook/addon-postcss: 3.0.0-alpha.1
  • @storybook: 7.0

Notes

addon-postcss it's using "css-loader": "^3.6.0", when the latest stable version is 6.7.3 https://www.npmjs.com/package/css-loader?activeTab=versions

nathanredblur avatar Jan 13 '23 01:01 nathanredblur