question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Angular storybook library fails to compile if using workspace.json

See original GitHub issue

Expected Behavior

Storybook should work for an Angular library inside an nx workspace using a workspace.json file.

Current Behavior

Storybook compilation fails with error:

Could not find angular.json using /my-path-to-workspace/angular.json

Failure Information (for bugs)

When building storybook for Angular, storybook assumes there is an angular.json. This can be seen here.

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

  1. npx create-nx-workspace@latest repro-workspace (choose empty nx)
  2. yarn add --dev @nrwl/angular
  3. nx g @nrwl/angular:app my-app
  4. nx g @nrwl/angular:lib my-lib
  5. nx g @nrwl/angular:component components/hello-world --project my-lib
  6. yarn add --dev @nrwl/storybook
  7. nx g @nrwl/angular:storybook-configuration my-lib
  8. nx storybook my-lib

Other

I know the problem lies with storybook for assuming angular.json, but a workspace.json file is entirely unique to Nx which is why I chose to post this issue here.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:7

github_iconTop GitHub Comments

2reactions
isaacplmanncommented, May 22, 2020

This is an issue with @storybook/angular expecting angular.json to be in the root of the workspace. I’ve opened a PR that checks for workspace.json as well: https://github.com/storybookjs/storybook/pull/10881

Feel free to lobby for it to be reviewed.

0reactions
RafaelVidaurrecommented, Aug 18, 2020

Got rid of the warning by updating @storybook/angular to mayor version 6. Not ideal and not sure if this can cause some other problems with nx, working so far though.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Build your design system with Storybook + Nx
Generate stories for your existing components (if any); Add targets to your workspace.json to serve and build Storybook; Generate a Cypress ...
Read more >
is missing from the TypeScript compilation. Please make sure ...
I have a single Angular app with some libs. I only want one Storybook instance, which contains all the stories of the Libs....
Read more >
nrwl-nx/community - Gitter
blabla' instead of using my workspacename ie @frontend/lib/blabla ... that nx run my-component-library:storybook fails to resolve a module if the project is ...
Read more >
Angular Library + Storybook - DEV Community 👩‍💻👨‍💻
After configuring storybook make sure the .storybook/tsconfig.json file is extending the library tsconfig.lib.json . The extends property in ...
Read more >
Angular 6 Workspace :: Test-Drive | by Matt Vaughn - Medium
json knows that this type of project is library it can now use different build strategies for different project types - library projects...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found