docs(storybook): add missing --project flag (#13833)

docs/generated/packages/storybook.json

@@ -17,7 +17,7 @@
       "id": "overview-react",
       "name": "Set up Storybook for React Projects",
       "file": "shared/guides/storybook/plugin-react",
-      "content": "# Set up Storybook for React Projects\n\nThis guide will walk you through setting up [Storybook](https://storybook.js.org) for React projects in your Nx workspace.\n\n{% callout type=\"warning\" title=\"Set up Storybook in your workspace\" %}\nYou first need to set up Storybook for your Nx workspace, if you haven't already. You can read the [Storybook plugin overview guide](/packages/storybook) to get started.\n{% /callout %}\n\n## Generate Storybook Configuration for a React project\n\nYou can generate Storybook configuration for an individual React project with this command:\n\n```shell\nnx g @nrwl/react:storybook-configuration project-name\n```\n\n## Nx React Storybook Preset\n\n`@nrwl/react` ships with a Storybook preset to make sure it uses the very same configuration as your Nx React application. When you generate a Storybook configuration for a project, it'll automatically add the preset to your configuration.\n\n```typescript\nconst rootMain = require('../../../.storybook/main');\n\nmodule.exports = {\n  ...rootMain,\n  addons: [...rootMain.addons, '@nrwl/react/plugins/storybook'],\n  ...\n};\n```\n\n## Auto-generate Stories\n\nThe `@nrwl/react:storybook-configuration` generator has the option to automatically generate `*.stories.ts` files for each component declared in the library.\n\n```text\n<some-folder>/\n├── my.component.ts\n└── my.component.stories.ts\n```\n\nYou can re-run it at a later point using the following command:\n\n```shell\nnx g @nrwl/react:stories <project-name>\n```\n\n{% callout type=\"note\" title=\"Example\" %}\n\nLet's take for a example a library in your workspace, under `libs/feature/ui`, called `feature-ui`. This library contains a component, called `my-button`.\n\nThe command to generate stories for that library would be:\n\n```shell\nnx g @nrwl/react:stories feature-ui\n```\n\nand the result would be the following:\n\n```text\n<workspace name>/\n├── .storybook/\n├── apps/\n├── libs/\n│   ├── feature/\n│   │   ├── ui/\n|   |   |   ├── .storybook/\n|   |   |   ├── src/\n|   |   |   |   ├──lib\n|   |   |   |   |   ├──my-button\n|   |   |   |   |   |   ├── my-button.component.ts\n|   |   |   |   |   |   ├── my-button.component.stories.ts\n|   |   |   |   |   |   └── etc...\n|   |   |   |   |   └── etc...\n|   |   |   ├── README.md\n|   |   |   ├── tsconfig.json\n|   |   |   └── etc...\n|   |   └── etc...\n|   └── etc...\n├── nx.json\n├── package.json\n├── README.md\n└── etc...\n```\n\n{% /callout %}\n\n## Cypress tests for Stories\n\nThe `storybook-configuration` generator gives the option to set up an e2e Cypress app that is configured to run against the project's Storybook instance.\n\nTo launch Storybook and run the Cypress tests against the iframe inside of Storybook:\n\n```shell\nnx run project-name-e2e:e2e\n```\n\nThe url that Cypress points to should look like this:\n\n`'/iframe.html?id=buttoncomponent--primary&args=text:Click+me!;padding;style:default'`\n\n- `buttoncomponent` is a lowercase version of the `Title` in the `*.stories.ts` file.\n- `primary` is the name of an individual story.\n- `style=default` sets the `style` arg to a value of `default`.\n\nChanging args in the url query parameters allows your Cypress tests to test different configurations of your component. You can [read the documentation](https://storybook.js.org/docs/react/writing-stories/args#setting-args-through-the-url) for more information.\n\n## Example Files\n\n**\\*.stories.tsx file**\n\n```typescript\nimport { Story, Meta } from '@storybook/react';\nimport { Button, ButtonProps } from './button';\n\nexport default {\n  component: Button,\n  title: 'Button',\n} as Meta;\n\nconst Template: Story<ButtonProps> = (args) => <Button {...args} />;\n\nexport const Primary = Template.bind({});\nPrimary.args = {\n  text: 'Click me!',\n  padding: 0,\n  style: 'default',\n};\n```\n\n**Cypress test file**\n\n> Depending on your Cypress version, the file will end with .spec.ts or .cy.ts\n\n```typescript\ndescribe('shared-ui', () => {\n  beforeEach(() =>\n    cy.visit(\n      '/iframe.html?id=buttoncomponent--primary&args=text:Click+me!;padding;style:default'\n    )\n  );\n\n  it('should render the component', () => {\n    cy.get('storybook-trial-button').should('exist');\n  });\n});\n```\n\n## More Documentation\n\nYou can find all Storybook-related Nx topics [here](/packages#storybook).\n\nFor more on using Storybook, see the [official Storybook documentation](https://storybook.js.org/docs/react/get-started/introduction).\n\n### Migration Scenarios\n\nHere's more information on common migration scenarios for Storybook with Nx. For Storybook specific migrations that are not automatically handled by Nx please refer to the [official Storybook page](https://storybook.js.org/)\n\n- [Upgrading to Storybook 6](/storybook/upgrade-storybook-v6-react)\n- [Migrate to the Nrwl React Storybook Preset](/storybook/migrate-webpack-final-react)\n"
+      "content": "# Set up Storybook for React Projects\n\nThis guide will walk you through setting up [Storybook](https://storybook.js.org) for React projects in your Nx workspace.\n\n{% callout type=\"warning\" title=\"Set up Storybook in your workspace\" %}\nYou first need to set up Storybook for your Nx workspace, if you haven't already. You can read the [Storybook plugin overview guide](/packages/storybook) to get started.\n{% /callout %}\n\n## Generate Storybook Configuration for a React project\n\nYou can generate Storybook configuration for an individual React project with this command:\n\n```shell\nnx g @nrwl/react:storybook-configuration project-name\n```\n\n## Nx React Storybook Preset\n\n`@nrwl/react` ships with a Storybook preset to make sure it uses the very same configuration as your Nx React application. When you generate a Storybook configuration for a project, it'll automatically add the preset to your configuration.\n\n```typescript\nconst rootMain = require('../../../.storybook/main');\n\nmodule.exports = {\n  ...rootMain,\n  addons: [...rootMain.addons, '@nrwl/react/plugins/storybook'],\n  ...\n};\n```\n\n## Auto-generate Stories\n\nThe `@nrwl/react:storybook-configuration` generator has the option to automatically generate `*.stories.ts` files for each component declared in the library.\n\n```text\n<some-folder>/\n├── my.component.ts\n└── my.component.stories.ts\n```\n\nYou can re-run it at a later point using the following command:\n\n```shell\nnx g @nrwl/react:stories --project=<project-name>\n```\n\n{% callout type=\"note\" title=\"Example\" %}\n\nLet's take for a example a library in your workspace, under `libs/feature/ui`, called `feature-ui`. This library contains a component, called `my-button`.\n\nThe command to generate stories for that library would be:\n\n```shell\nnx g @nrwl/react:stories --project=feature-ui\n```\n\nand the result would be the following:\n\n```text\n<workspace name>/\n├── .storybook/\n├── apps/\n├── libs/\n│   ├── feature/\n│   │   ├── ui/\n|   |   |   ├── .storybook/\n|   |   |   ├── src/\n|   |   |   |   ├──lib\n|   |   |   |   |   ├──my-button\n|   |   |   |   |   |   ├── my-button.component.ts\n|   |   |   |   |   |   ├── my-button.component.stories.ts\n|   |   |   |   |   |   └── etc...\n|   |   |   |   |   └── etc...\n|   |   |   ├── README.md\n|   |   |   ├── tsconfig.json\n|   |   |   └── etc...\n|   |   └── etc...\n|   └── etc...\n├── nx.json\n├── package.json\n├── README.md\n└── etc...\n```\n\n{% /callout %}\n\n## Cypress tests for Stories\n\nThe `storybook-configuration` generator gives the option to set up an e2e Cypress app that is configured to run against the project's Storybook instance.\n\nTo launch Storybook and run the Cypress tests against the iframe inside of Storybook:\n\n```shell\nnx run project-name-e2e:e2e\n```\n\nThe url that Cypress points to should look like this:\n\n`'/iframe.html?id=buttoncomponent--primary&args=text:Click+me!;padding;style:default'`\n\n- `buttoncomponent` is a lowercase version of the `Title` in the `*.stories.ts` file.\n- `primary` is the name of an individual story.\n- `style=default` sets the `style` arg to a value of `default`.\n\nChanging args in the url query parameters allows your Cypress tests to test different configurations of your component. You can [read the documentation](https://storybook.js.org/docs/react/writing-stories/args#setting-args-through-the-url) for more information.\n\n## Example Files\n\n**\\*.stories.tsx file**\n\n```typescript\nimport { Story, Meta } from '@storybook/react';\nimport { Button, ButtonProps } from './button';\n\nexport default {\n  component: Button,\n  title: 'Button',\n} as Meta;\n\nconst Template: Story<ButtonProps> = (args) => <Button {...args} />;\n\nexport const Primary = Template.bind({});\nPrimary.args = {\n  text: 'Click me!',\n  padding: 0,\n  style: 'default',\n};\n```\n\n**Cypress test file**\n\n> Depending on your Cypress version, the file will end with .spec.ts or .cy.ts\n\n```typescript\ndescribe('shared-ui', () => {\n  beforeEach(() =>\n    cy.visit(\n      '/iframe.html?id=buttoncomponent--primary&args=text:Click+me!;padding;style:default'\n    )\n  );\n\n  it('should render the component', () => {\n    cy.get('storybook-trial-button').should('exist');\n  });\n});\n```\n\n## More Documentation\n\nYou can find all Storybook-related Nx topics [here](/packages#storybook).\n\nFor more on using Storybook, see the [official Storybook documentation](https://storybook.js.org/docs/react/get-started/introduction).\n\n### Migration Scenarios\n\nHere's more information on common migration scenarios for Storybook with Nx. For Storybook specific migrations that are not automatically handled by Nx please refer to the [official Storybook page](https://storybook.js.org/)\n\n- [Upgrading to Storybook 6](/storybook/upgrade-storybook-v6-react)\n- [Migrate to the Nrwl React Storybook Preset](/storybook/migrate-webpack-final-react)\n"
     },
     {
       "id": "overview-angular",

docs/shared/guides/storybook/plugin-react.md

@@ -41,7 +41,7 @@ The `@nrwl/react:storybook-configuration` generator has the option to automatica
 You can re-run it at a later point using the following command:
 
 ```shell
-nx g @nrwl/react:stories <project-name>
+nx g @nrwl/react:stories --project=<project-name>
 ```
 
 {% callout type="note" title="Example" %}
@@ -51,7 +51,7 @@ Let's take for a example a library in your workspace, under `libs/feature/ui`, c
 The command to generate stories for that library would be:
 
 ```shell
-nx g @nrwl/react:stories feature-ui
+nx g @nrwl/react:stories --project=feature-ui
 ```
 
 and the result would be the following: