Webpack 5? #23
Labels
bug
Something isn't working
Comments
|
The last time I checked it worked with webpack 5. Do you have any errors in the console ? |
|
No, it all looks very good. Here's my module.exports = {
stories: ['../src/**/*.stories.svelte'],
addons: [
'@storybook/addon-svelte-csf',
'@storybook/addon-links',
'@storybook/addon-essentials',
{
name: '@storybook/addon-postcss',
options: {
postcssLoaderOptions: {
implementation: require('postcss'),
},
},
},
],
core: { builder: 'webpack5' },
};Here are all the (probably?) relevant entries from "devDependencies": {
...
"@storybook/addon-actions": "^6.3.0-alpha.8",
"@storybook/addon-essentials": "^6.3.0-alpha.8",
"@storybook/addon-links": "^6.3.0-alpha.8",
"@storybook/addon-postcss": "^2.0.0",
"@storybook/addon-svelte-csf": "^1.0.0",
"@storybook/builder-webpack5": "^6.3.0-alpha.8",
"@storybook/svelte": "^6.3.0-alpha.8",
"svelte": "^3.35.0",
"svelte-loader": "^3.0.0",
"svelte-preprocess": "^4.6.1",
...
}And this is what I see on startup: Any ideas where I could look for this problem? It was working yesterday - only then I tried to add pdfjs-dist to the project, which uses optional chaining syntax, and I decided to solve that problem by going to Webpack 5 and then the stories were gone! I can see that the only differences in the project are the added line ( +++ b/frontend/ggui-svelte/package.json
@@ -34,12 +34,13 @@
"@rollup/plugin-replace": "^2.4.2",
"@snowpack/plugin-postcss": "^1.2.1",
"@snowpack/plugin-svelte": "^3.6.0",
- "@storybook/addon-actions": "^6.2.0-rc.8",
- "@storybook/addon-essentials": "^6.2.0-rc.8",
- "@storybook/addon-links": "^6.2.0-rc.8",
+ "@storybook/addon-actions": "^6.3.0-alpha.8",
+ "@storybook/addon-essentials": "^6.3.0-alpha.8",
+ "@storybook/addon-links": "^6.3.0-alpha.8",
"@storybook/addon-postcss": "^2.0.0",
"@storybook/addon-svelte-csf": "^1.0.0",
- "@storybook/svelte": "^6.2.0-rc.8",
+ "@storybook/builder-webpack5": "^6.3.0-alpha.8",
+ "@storybook/svelte": "^6.3.0-alpha.8",
"autoprefixer": "^10.1.0",
"babel-jest": "^26.6.3",
"babel-loader": "^8.2.2",
@@ -53,6 +54,7 @@
"jest-cli": "^26.6.3",
"lodash-es": "^4.17.21",
"npm-run-all": "^4.1.5",
+ "pdfjs-dist": "^2.7.570",
"postcss": "^8.2.7",
"postcss-apply": "^0.12.0",
"postcss-cli": "^8.3.1", |
|
I don't think it's a good idea to use storybook 6.3.0-alpha, it's not a stable version. |
|
The version is what I got when I followed the instructions. Also - wow, I never knew the browser console would have so much info in a case like this :) I don't have time right now to look into it in detail, this certainly looks very informative. |
You bundle two svelte runtimes. add this to your exports in webpackFinal: (config) => {
config.resolve.alias.svelte = path.resolve('node_modules', 'svelte')
return config;
}, |
|
Excellent, that solved my problem. Very nice find! Now, for my understanding - how do I end up bundling two Svelte runtimes? Any ideas? (Edit: I checked, because I thought you were referring to conflicting versions - I have only one Svelte package anywhere in |
7 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I followed the instructions to upgrade to the latest Storybook pre-release version, in order to go to Webpack 5 (because I have trouble with the lack of optional chaining support in Webpack 4).
I have two results:
I suspect incompatibilities between the Webpack 5 compatible Storybook pre-release and this addon. In case I'm wrong and this is an issue that requires lots of research, I'll gladly debug and supply many details - but right now I assume that those in the know will say something along the lines of "obviously this can't possibly work right now, you dumb fool". So please go ahead!
The text was updated successfully, but these errors were encountered: