Running npx sb init on a simple react project results in a broken Storybook

[Bikeman868]

Launching Storkbook displays a warning message, and the UI says that their are no stories configured.

Steps to reproduce the behavior:

1. Clone this repo https://github.com/Bikeman868/react-svg-pie
2. From a terminal window run npm ci to install dependencies.
3. From a terminal window run npx sb init as described in the Storybook installation guide.
4. From a terminal window run npm run storybook
5. See that all JSX syntax generates warnings
6. See that the Storybook UI says that there are no stories configured

The npx sb init command added some example stories to a stories folder. I would expect these stories to show up at least in the UI. My own components also have stories defined for them.

I also tried npx sb init --type react but this made no difference.

[shilman]

This project has a variety of issues:

• It's missing dev dependencies on react-dom / react / @material-ui/core
• It overrides the babel config in a way that's incompatible with storybook

If I add those peer dependencies as dev dependencies and remove the babel config, Storybook loads the CLI-generated stories. There are still problems with the stories in the repo, but I didn't have time to debug them.

[Bikeman868]

Thanks for your response. This is an npm package, and setting dev dependencies is not appropriate. Is there a workaround for that? I couldn’t find any docs on what Babel configs are compatible or incompatible with Storybook. Presumably I can have a different Babel config just for Storybook? If so, what does it need to look like?

…

On Feb 16, 2021, at 6:19 PM, Michael Shilman ***@***.***> wrote:  This project has a variety of issues: It's missing dev dependencies on react-dom / react / @material-ui/core It overrides the babel config in a way that's incompatible with storybook If I add those peer dependencies as dev dependencies and remove the babel config, Storybook loads the CLI-generated stories. There are still problems with the stories in the repo, but I didn't have time to debug them. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

[shilman]

why aren't dev dependencies appropriate in an npm package?

[Bikeman868]

I was thinking dependencies rather than dev dependencies. There is no issue with having react in dev dependencies and peer dependencies so I will do that. Any docs on what works or doesn’t work in the Babel config?

…

On Feb 16, 2021, at 7:33 PM, Michael Shilman ***@***.***> wrote:  why aren't dev dependencies appropriate in an npm package? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.