Rescope @nrwl to @nx
@nx/angularSee schema

@nx/angular:stories

Creates Storybook stories/specs for all Angular components declared in a project.

This generator will generate stories for all your components in your project. The stories will be generated using Component Story Format 3 (CSF3).

nx g @nx/angular:stories project-name
Nx 15 and lower use @nrwl/ instead of @nx/

You can read more about how this generator works, in the Storybook for Angular overview page.

When running this generator, you will be prompted to provide the following:

  • The name of the project you want to generate the configuration for.
  • Whether you want to generateCypressSpecs. If you choose yes, a test file is going to be generated in the project's Cypress e2e app for each of your components.

You must provide a name for the generator to work.

There are a number of other options available. Let's take a look at some examples.

Examples

Ignore certain paths when generating stories

nx g @nx/angular:stories ui --ignorePaths=libs/ui/src/not-stories/**,**/**/src/**/*.other.*
Nx 15 and lower use @nrwl/ instead of @nx/

This will generate stories for all the components in the ui project, except for the ones in the libs/ui/src/not-stories directory, and also for components that their file name is of the pattern *.other.*.

This is useful if you have a project that contains components that are not meant to be used in isolation, but rather as part of a larger component.

Usage

nx generate stories ...

By default, Nx will search for stories in the default collection provisioned in workspace.json.

You can specify the collection explicitly as follows:

nx g @nx/angular:stories ...
Nx 15 and lower use @nrwl/ instead of @nx/

Show what will be generated without writing to disk:

nx g stories ... --dry-run

Options

name

Required
string

Project for which to generate stories.

interactionTests

boolean
Default: true

Set up Storybook interaction tests.

cypressProject

string

The Cypress project to generate the stories under. This is inferred from name by default.

generateCypressSpecs

boolean

Specifies whether to automatically generate *.spec.ts files in the Cypress e2e app generated by the cypress-configure generator.

ignorePaths

Array<string>

Paths to ignore when looking for components.

skipFormat

boolean
Default: false

Skip formatting files.