Open phated opened 3 years ago
Before Storybook 6.2, it used to install additional loaders on .css
and that causes this to crash. In the same way, CRA already had postcss and other loaders on the .css
extension that crash this.
I managed to workout way that works with CRA, you could amend your plugin to do the same
// .storybook/main.js
webpackFinal: (config) => {
const replaceCRAPostCSS = (config) => {
if (!config) return;
if (Array.isArray(config)) {
return config.forEach(replaceCRAPostCSS);
}
if (typeof config === 'object') {
const { test, use } = config;
if (test && use && test.toString() === '/\\.css$/') {
const loader = use.find((loader) => {
const path = typeof loader === 'string' ? loader : loader.loader;
return path && path.match(/postcss-loader/);
});
if (loader) {
loader.options = {
config: {
path: require.resolve('../postcss.config.js')
}
};
}
return;
}
// need that as they use oneOf in use too
return Object.values(config).forEach(replaceCRAPostCSS);
}
};
replaceCRAPostCSS(config);
return config;
}
@sielay We won't be changing the plugin based on your suggestion because it changes the way CRA works between your storybook and starting your application. CRA doesn't load postcss config files.
Is there anyway we could add these requirements to the Readme? Might save people some time.
Why?