我正在为我的React应用程序设置一本故事书。我面临着PostCSS的问题,显然我的故事书配置不处理PostCSS,我的风格被完全忽略了。
这是我的包.json:
{
...
"devDependencies": {
"@storybook/addon-actions": "^6.2.8",
"@storybook/addon-essentials": "^6.2.8",
"@storybook/addon-links": "^6.2.8",
"@storybook/addon-postcss": "^2.0.0",
"@storybook/react": "^6.2.8",
"css-loader": "2.1.1",
"extract-css-chunks-webpack-plugin": "4.3.2",
"postcss-cssnext": "^3.1.0",
"postcss-csso": "^3.0.0",
"postcss-loader": "^3.0.0",
"style-loader": "^2.0.0"
}
}
这是我的main.js:
module.exports = {
"stories": [
"../src/**/*.stories.@(js|jsx|ts|tsx)",
],
"addons": [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-postcss"
]
}
欢迎任何帮助。
尝试将postcss
升级到版本8:
npm i -D postcss@8
然后,将当前对main.js
文件中@storybook/addon-postcss
的引用替换为:
{
name: "@storybook/addon-postcss",
options: {
postcssLoaderOptions: {
implementation: require("postcss"),
},
},
},