required semicolons or commas for interfaces in stories
stefan-wullems opened this issue · 6 comments
When defining an interface in a story, the build fails if the properties are not separated by either semicolons or commas. In normal files this works just fine.
Can you provide more details? Which framework do you use? I assume you are using TypeScript? Can you provide a Code-Snippet or even better a reproduction example repository?
I stripped most unrelated things from our repository. here's the repo
Steps to reproduce:
- run yarn in console
- run yarn start in console
- navigate to src/Component/Component.stories.tsx
- remove the comma from the interface
For the record - the stacktrace:
WARNING in ./src/Component/Component.stories.tsx
Module build failed (from ./node_modules/@storybook/addon-storysource/loader.js):
SyntaxError: Unexpected token (11:3)
at t (D:\04_Development\ts-storybook-interface-error\node_modules\prettier\parser-babylon.js:1:326)
at Object.parse (D:\04_Development\ts-storybook-interface-error\node_modules\prettier\parser-babylon.js:1:208490)
at Object.parse (D:\04_Development\ts-storybook-interface-error\node_modules\@storybook\addon-storysource\dist\loader\parsers\parser-js.js:13:47)
at generateSourceWithDecorators (D:\04_Development\ts-storybook-interface-error\node_modules\@storybook\addon-storysource\dist\loader\generate-helpers.js:71:22)
at inject (D:\04_Development\ts-storybook-interface-error\node_modules\@storybook\addon-storysource\dist\loader\inject-decorator.js:30:84)
at Object.transform (D:\04_Development\ts-storybook-interface-error\node_modules\@storybook\addon-storysource\dist\loader\index.js:18:47)
@ ./src sync .stories.(js|tsx)$ ./Component/Component.stories.tsx
@ ./docs/config.js
@ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./docs/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true
addon-storysource causes it (as you can see in the stacktrace)
module.exports = async ({ config }) => {
// Storysource
config.module.rules.push({
test: /\.stories\.tsx?$/,
loaders: [
require.resolve('@storybook/addon-storysource/loader')
],
enforce: 'pre'
})
return config
}
This one fails
interface Interface {
test1: string
test2: string
}Removing the storysource code in webpack.config.js resolves the error.
It has a workaround.
interface Interface {
test1: string;
test2: string;
}Good catch 👍
Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!
Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!