Tutorial command `nx g @nrwl/react:storybook-configuration project-name` fails
See original GitHub issueCurrent Behavior
The command from the tutorial at https://nx.dev/storybook/overview-react#generating-storybook-configuration does not work
Expected Behavior
The command should scaffold Storybook for Nx monorepo
Steps to Reproduce
Run npx nx g @nrwl/react:storybook-configuration webapp
.
Note: I am migrating an existing CRA app to Nx. First, I used the CRA migration script and now I tried to add Storybook.
This issue may not be prioritized if details are not provided to help us reproduce the issue.
Failure Logs
npx nx g @nrwl/react:storybook-configuration webapp
✔ Configure a cypress e2e app to run against the storybook instance? (Y/n) · false
✔ Automatically generate *.stories.ts files for components declared in this project? (Y/n) · false
✔ Automatically generate *.spec.ts files in the cypress e2e app generated by the cypress-configure generator? (Y/n) · false
adding .storybook folder to the root directory -
based on the Storybook version installed (v6), we'll bootstrap a scaffold for that particular version.
adding .storybook folder to app - using Storybook version 6
Cannot read properties of undefined (reading 'map')
Environment
npx nx report
> NX Report complete - copy this into the issue template
Node : 16.14.0
OS : darwin x64
yarn : 1.22.17
nx : 13.8.5
@nrwl/angular : undefined
@nrwl/cli : 13.8.5
@nrwl/cypress : 13.8.5
@nrwl/detox : undefined
@nrwl/devkit : 13.8.5
@nrwl/eslint-plugin-nx : 13.8.4
@nrwl/express : undefined
@nrwl/jest : 13.8.5
@nrwl/js : 13.8.5
@nrwl/linter : 13.8.5
@nrwl/nest : undefined
@nrwl/next : undefined
@nrwl/node : undefined
@nrwl/nx-cloud : 13.1.6
@nrwl/react : 13.8.5
@nrwl/react-native : undefined
@nrwl/schematics : undefined
@nrwl/storybook : 13.8.5
@nrwl/tao : 13.8.5
@nrwl/web : 13.8.5
@nrwl/workspace : 13.8.5
typescript : 4.6.2
rxjs : 6.6.7
---------------------------------------
Community plugins:
Issue Analytics
- State:
- Created 2 years ago
- Comments:12 (5 by maintainers)
Top Results From Across the Web
nx cannot read properties of undefined (reading 'map')
my storybook is running on localhost:4400 and working properly, has anyone experienced this error? Open side panel.
Read more >Set up Storybook for React Projects - Nx
You can generate Storybook configuration for an individual React project with this command: nx g @nrwl/react:storybook-configuration project-name ...
Read more >Use Storybook with Tailwind in an Nx Workspace | juri.dev
Choose “Nx generate (ui)” and search for “@nrwl/react:storybook-configuration”. Provide the shared-ui in the project name to make sure the ...
Read more >Nx Swept Command Tool Tutorial - YouTube
Nx Swept Command Tool Tutorial. This tutorial shows how to use swept tool in Nx step by step. Topics covered in this tutorial...
Read more >Build your design system with Storybook + Nx
Then, all you have to do is run the right Nx command to generate your stories (nx g @nrwl/react:stories — name=my-project-name or nx...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Hi there @mdirshaddev ! Thanks for jumping in! I tried it this morning and it looks like it’s working for me. Can you please send me a reproduction repository?
Steps I did:
npx create-nx-workspace@latest my-wksp
and chooseapps
yarn add @nrwl/angular@latest @nrwl/react@latest @nrwl/storybook@latest
nx g @nrwl/angular:storybook-configuration my-app
nx g @nrwl/react:storybook-configuration my-other-app
That should fix it, thanks!