小编Sal*_*dog的帖子

我可以在 Storybook 5(React 风格)中使用 CSS 模块吗?

我正在尝试在我的项目中使用 Storybook v5.0,并且我正在使用 React + Webpack4 + CSS 模块。(我没有使用 CreateReactApp)

我的设置非常简单,并且我能够在没有 CSS 模块的情况下很好地设置 Storybook。

但是,如果我尝试编辑自定义故事书 webpack 配置以支持 CSS 模块,则会出错。

当我运行时,npm run storybook我得到的错误是:

ERROR in ./src/components/Test/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-1!./node_modules/postcss-loader/src??postcss!./node_modules/style-loader!./node_modules/css-loader/dist/cjs.js??ref--9-1!./node_modules/postcss-loader/src!./src/components/Test/index.css)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
SyntaxError

(2:1) Unknown word

  1 |
> 2 | var content = require("!!../../../node_modules/css-loader/dist/cjs.js??ref--9-1!../../../node_modules/postcss-loader/src/index.js!./index.css");
    | ^
  3 |
  4 | if(typeof content === 'string') content = [[module.id, content, '']];
Run Code Online (Sandbox Code Playgroud)

在我的package.json

"@storybook/addon-actions": "^5.0.0",
"@storybook/addons": "^5.0.0",
"@storybook/react": "^5.0.0",
Run Code Online (Sandbox Code Playgroud)

.storybook/webpack.config.js遵循他们网站上的示例,如下所示:

const path = require("path");

const stylesLoaders = …
Run Code Online (Sandbox Code Playgroud)

webpack css-modules react-css-modules storybook

7
推荐指数
2
解决办法
1万
查看次数