{
  "githubRoot": "https://github.com/nrwl/nx/blob/master",
  "name": "react",
  "description": "The React plugin contains executors and generators for managing React applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Jest, Cypress, and Storybook.\n\n- Generators for applications, libraries, components, hooks, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
  "root": "/packages/react",
  "source": "/packages/react/src",
  "documentation": [
    {
      "name": "Overview",
      "id": "overview",
      "path": "/packages/react",
      "file": "shared/react-plugin",
      "content": "![React Logo](/shared/react-logo.png)\n\nThe React plugin contains executors and generators for managing React applications and libraries within an Nx workspace.\nIt provides:\n\n- Integration with libraries such as Jest, Cypress, and Storybook.\n- Generators for applications, libraries, components, hooks, and more.\n- Library build support for publishing packages to npm or other registries.\n- Utilities for automatic workspace refactoring.\n\n## Setting Up React\n\nTo create a new workspace with React, run `npx create-nx-workspace@latest --preset=react`.\n\nTo add the React plugin to an existing workspace, run one of the following:\n\n```bash\n# For npm users\nnpm install -D @nrwl/react\n\n# For yarn users\nyarn add -D @nrwl/react\n```\n\n### Creating Applications and Libraries\n\nYou can add a new application with the following:\n\n```bash\nnx g @nrwl/react:app my-new-app\n```\n\nTo start the application in development mode, run `nx serve my-new-app`.\n\nAnd add a new library as follows:\n\n```bash\nnx g @nrwl/react:lib my-new-lib\n\n# If you want the library to be buildable or publishable to npm\nnx g @nrwl/react:lib my-new-lib --buildable\nnx g @nrwl/react:lib my-new-lib \\\n--publishable \\\n--importPath=@myorg/my-new-lib\n```\n\nRead more about [building and publishing libraries here](/structure/buildable-and-publishable-libraries).\n\n### Creating Components\n\nAdding a component to an existing project can be done with:\n\n```bash\nnx g @nrwl/react:component my-new-component \\\n--project=my-new-app\n\n# Note: If you want to export the component\n# from the library use  --export\nnx g @nrwl/react:component my-new-component \\\n--project=my-new-lib \\\n--export\n```\n\nReplace `my-new-app` and `my-new-lib` with the name of your projects.\n\n### Creating Hooks\n\nIf you want to add a new hook, run the following\n\n```bash\nnx g @nrwl/react:hook my-new-hook --project=my-new-lib\n```\n\nReplace `my-new-lib` with the name of your project.\n\n## Using React\n\n### Testing Projects\n\nYou can run unit tests with:\n\n```bash\nnx test my-new-app\nnx test my-new-lib\n```\n\nReplace `my-new-app` with the name or your project. This command works for both applications and libraries.\n\nYou can also run E2E tests for applications:\n\n```bash\nnx e2e my-new-app-e2e\n```\n\nReplace `my-new-app-e2e` with the name or your project with `-e2e` appended.\n\n### Building Projects\n\nReact applications can be build with:\n\n```bash\nnx build my-new-app\n```\n\nAnd if you generated a library with `--buildable`, then you can build a library as well:\n\n```bash\nnx build my-new-lib\n```\n\nThe output is in the `dist` folder. You can customize the output folder by setting `outputPath` in the\nproject's `project.json` file.\n\nThe application in `dist` is deployable, and you can try it out locally with:\n\n```bash\nnpx http-server dist/apps/my-new-app\n```\n\nThe library in `dist` is publishable to npm or a private registry.\n\n## More Documentation\n\n- [Using Cypress](/cypress/overview)\n- [Using Jest](/jest/overview)\n- [Using Storybook](/storybook/overview-react)\n"
    }
  ],
  "generators": [
    {
      "name": "init",
      "factory": "./src/generators/init/init#reactInitGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "$id": "NxReactNgInit",
        "title": "Init React Plugin",
        "description": "Initialize a React Plugin.",
        "cli": "nx",
        "type": "object",
        "properties": {
          "unitTestRunner": {
            "description": "Adds the specified unit test runner.",
            "type": "string",
            "enum": ["jest", "none"],
            "default": "jest"
          },
          "e2eTestRunner": {
            "description": "Adds the specified E2E test runner.",
            "type": "string",
            "enum": ["cypress", "none"],
            "default": "cypress"
          },
          "skipFormat": {
            "description": "Skip formatting files.",
            "type": "boolean",
            "default": false
          },
          "js": {
            "type": "boolean",
            "default": false,
            "description": "Use JavaScript instead of TypeScript"
          }
        },
        "required": [],
        "presets": []
      },
      "description": "Initialize the `@nrwl/react` plugin.",
      "aliases": ["ng-add"],
      "hidden": true,
      "implementation": "/packages/react/src/generators/init/init#reactInitGenerator.ts",
      "path": "/packages/react/src/generators/init/schema.json"
    },
    {
      "name": "application",
      "factory": "./src/generators/application/application#applicationGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactApp",
        "title": "Create a React Application",
        "description": "Create a React application for Nx.",
        "examples": [
          {
            "command": "nx g app myapp --directory=myorg",
            "description": "Generate `apps/myorg/myapp` and `apps/myorg/myapp-e2e`"
          },
          {
            "command": "nx g app myapp --classComponent",
            "description": "Use class components instead of functional components"
          },
          {
            "command": "nx g app myapp --routing",
            "description": "Set up React Router"
          }
        ],
        "type": "object",
        "properties": {
          "name": {
            "description": "The name of the application.",
            "type": "string",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use for the application?",
            "pattern": "^[a-zA-Z].*$"
          },
          "directory": {
            "description": "The directory of the new application.",
            "type": "string",
            "alias": "dir"
          },
          "style": {
            "description": "The file extension to be used for style files.",
            "type": "string",
            "default": "css",
            "alias": "s",
            "x-prompt": {
              "message": "Which stylesheet format would you like to use?",
              "type": "list",
              "items": [
                { "value": "css", "label": "CSS" },
                {
                  "value": "scss",
                  "label": "SASS(.scss)       [ http://sass-lang.com                     ]"
                },
                {
                  "value": "styl",
                  "label": "Stylus(.styl)     [ http://stylus-lang.com                   ]"
                },
                {
                  "value": "less",
                  "label": "LESS              [ http://lesscss.org                       ]"
                },
                {
                  "value": "styled-components",
                  "label": "styled-components [ https://styled-components.com            ]"
                },
                {
                  "value": "@emotion/styled",
                  "label": "emotion           [ https://emotion.sh                       ]"
                },
                {
                  "value": "styled-jsx",
                  "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
                },
                { "value": "none", "label": "None" }
              ]
            }
          },
          "linter": {
            "description": "The tool to use for running lint checks.",
            "type": "string",
            "enum": ["eslint", "tslint"],
            "default": "eslint"
          },
          "routing": {
            "type": "boolean",
            "description": "Generate application with routes.",
            "x-prompt": "Would you like to add React Router to this application?",
            "default": false
          },
          "skipFormat": {
            "description": "Skip formatting files.",
            "type": "boolean",
            "default": false
          },
          "skipWorkspaceJson": {
            "description": "Skip updating `workspace.json` with default options based on values provided to this app (e.g. babel, style).",
            "type": "boolean",
            "default": false
          },
          "unitTestRunner": {
            "type": "string",
            "enum": ["jest", "none"],
            "description": "Test runner to use for unit tests.",
            "default": "jest"
          },
          "e2eTestRunner": {
            "type": "string",
            "enum": ["cypress", "none"],
            "description": "Test runner to use for end to end (E2E) tests.",
            "default": "cypress"
          },
          "tags": {
            "type": "string",
            "description": "Add tags to the application (used for linting).",
            "alias": "t"
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case component file name (e.g. `App.tsx`).",
            "alias": "P",
            "default": false
          },
          "classComponent": {
            "type": "boolean",
            "description": "Use class components instead of functional component.",
            "alias": "C",
            "default": false
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "globalCss": {
            "type": "boolean",
            "description": "Default is `false`. When `true`, the component is generated with `*.css`/`*.scss` instead of `*.module.css`/`*.module.scss`.",
            "default": false
          },
          "strict": {
            "type": "boolean",
            "description": "Creates an application with strict mode and strict type checking.",
            "default": true
          },
          "setParserOptionsProject": {
            "type": "boolean",
            "description": "Whether or not to configure the ESLint `parserOptions.project` option. We do not do this by default for lint performance reasons.",
            "default": false
          },
          "standaloneConfig": {
            "description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
            "type": "boolean"
          },
          "compiler": {
            "type": "string",
            "description": "The compiler to use.",
            "enum": ["babel", "swc"],
            "default": "babel"
          }
        },
        "required": [],
        "presets": []
      },
      "aliases": ["app"],
      "x-type": "application",
      "description": "Create a React application.",
      "implementation": "/packages/react/src/generators/application/application#applicationGenerator.ts",
      "hidden": false,
      "path": "/packages/react/src/generators/application/schema.json"
    },
    {
      "name": "library",
      "factory": "./src/generators/library/library#libraryGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactLibrary",
        "title": "Create a React Library",
        "description": "Create a React Library for an Nx workspace.",
        "type": "object",
        "examples": [
          {
            "command": "nx g lib mylib --directory=myapp",
            "description": "Generate `libs/myapp/mylib`"
          },
          {
            "command": "nx g lib mylib --appProject=myapp",
            "description": "Generate a library with routes and add them to `myapp`"
          }
        ],
        "properties": {
          "name": {
            "type": "string",
            "description": "Library name",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use for the library?",
            "pattern": "^[a-zA-Z].*$"
          },
          "directory": {
            "type": "string",
            "description": "A directory where the lib is placed.",
            "alias": "dir"
          },
          "style": {
            "description": "The file extension to be used for style files.",
            "type": "string",
            "default": "css",
            "alias": "s",
            "x-prompt": {
              "message": "Which stylesheet format would you like to use?",
              "type": "list",
              "items": [
                { "value": "css", "label": "CSS" },
                {
                  "value": "scss",
                  "label": "SASS(.scss)       [ http://sass-lang.com          ]"
                },
                {
                  "value": "styl",
                  "label": "Stylus(.styl)     [ http://stylus-lang.com        ]"
                },
                {
                  "value": "less",
                  "label": "LESS              [ http://lesscss.org            ]"
                },
                {
                  "value": "styled-components",
                  "label": "styled-components [ https://styled-components.com ]"
                },
                {
                  "value": "@emotion/styled",
                  "label": "emotion           [ https://emotion.sh            ]"
                },
                {
                  "value": "styled-jsx",
                  "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
                },
                { "value": "none", "label": "None" }
              ]
            }
          },
          "linter": {
            "description": "The tool to use for running lint checks.",
            "type": "string",
            "enum": ["eslint", "tslint"],
            "default": "eslint"
          },
          "unitTestRunner": {
            "type": "string",
            "enum": ["jest", "none"],
            "description": "Test runner to use for unit tests.",
            "default": "jest"
          },
          "tags": {
            "type": "string",
            "description": "Add tags to the library (used for linting).",
            "alias": "t"
          },
          "skipFormat": {
            "description": "Skip formatting files.",
            "type": "boolean",
            "default": false
          },
          "skipTsConfig": {
            "type": "boolean",
            "default": false,
            "description": "Do not update `tsconfig.json` for development experience."
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case component file name (e.g. `App.tsx`).",
            "alias": "P",
            "default": false
          },
          "routing": {
            "type": "boolean",
            "description": "Generate library with routes."
          },
          "appProject": {
            "type": "string",
            "description": "The application project to add the library route to.",
            "alias": "a"
          },
          "publishable": {
            "type": "boolean",
            "description": "Create a publishable library."
          },
          "buildable": {
            "type": "boolean",
            "default": false,
            "description": "Generate a buildable library."
          },
          "importPath": {
            "type": "string",
            "description": "The library name used to import it, like `@myorg/my-awesome-lib`."
          },
          "component": {
            "type": "boolean",
            "description": "Generate a default component.",
            "default": true
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "globalCss": {
            "type": "boolean",
            "description": "When `true`, the stylesheet is generated using global CSS instead of CSS modules (e.g. file is `*.css` rather than `*.module.css`).",
            "default": false
          },
          "strict": {
            "type": "boolean",
            "description": "Whether to enable tsconfig strict mode or not.",
            "default": true
          },
          "setParserOptionsProject": {
            "type": "boolean",
            "description": "Whether or not to configure the ESLint `parserOptions.project` option. We do not do this by default for lint performance reasons.",
            "default": false
          },
          "standaloneConfig": {
            "description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
            "type": "boolean"
          },
          "compiler": {
            "type": "string",
            "enum": ["babel", "swc"],
            "default": "babel",
            "description": "Which compiler to use."
          }
        },
        "required": ["name"],
        "presets": []
      },
      "aliases": ["lib"],
      "x-type": "library",
      "description": "Create a React library.",
      "implementation": "/packages/react/src/generators/library/library#libraryGenerator.ts",
      "hidden": false,
      "path": "/packages/react/src/generators/library/schema.json"
    },
    {
      "name": "component",
      "factory": "./src/generators/component/component#componentGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactComponent",
        "title": "Create a React Component",
        "description": "Create a React Component for Nx.",
        "type": "object",
        "examples": [
          {
            "command": "nx g component my-component --project=mylib",
            "description": "Generate a component in the `mylib` library"
          },
          {
            "command": "nx g component my-component --project=mylib --classComponent",
            "description": "Generate a class component in the `mylib` library"
          }
        ],
        "properties": {
          "project": {
            "type": "string",
            "description": "The name of the project.",
            "alias": "p",
            "$default": { "$source": "projectName" },
            "x-prompt": "What is the name of the project for this component?"
          },
          "name": {
            "type": "string",
            "description": "The name of the component.",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use for the component?"
          },
          "style": {
            "description": "The file extension to be used for style files.",
            "type": "string",
            "alias": "s",
            "default": "css",
            "x-prompt": {
              "message": "Which stylesheet format would you like to use?",
              "type": "list",
              "items": [
                { "value": "css", "label": "CSS" },
                {
                  "value": "scss",
                  "label": "SASS(.scss)       [ http://sass-lang.com          ]"
                },
                {
                  "value": "styl",
                  "label": "Stylus(.styl)     [ http://stylus-lang.com        ]"
                },
                {
                  "value": "less",
                  "label": "LESS              [ http://lesscss.org            ]"
                },
                {
                  "value": "styled-components",
                  "label": "styled-components [ https://styled-components.com ]"
                },
                {
                  "value": "@emotion/styled",
                  "label": "emotion           [ https://emotion.sh            ]"
                },
                {
                  "value": "styled-jsx",
                  "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
                },
                { "value": "none", "label": "None" }
              ]
            }
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "skipTests": {
            "type": "boolean",
            "description": "When true, does not create `spec.ts` test files for the new component.",
            "default": false
          },
          "directory": {
            "type": "string",
            "description": "Create the component under this directory (can be nested).",
            "alias": "dir"
          },
          "flat": {
            "type": "boolean",
            "description": "Create component at the source root rather than its own directory.",
            "default": false
          },
          "export": {
            "type": "boolean",
            "description": "When true, the component is exported from the project `index.ts` (if it exists).",
            "alias": "e",
            "default": false,
            "x-prompt": "Should this component be exported in the project?"
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case component file name (e.g. `App.tsx`).",
            "alias": "P",
            "default": false
          },
          "pascalCaseDirectory": {
            "type": "boolean",
            "description": "Use pascal case directory name (e.g. `App/App.tsx`).",
            "alias": "R",
            "default": false
          },
          "classComponent": {
            "type": "boolean",
            "alias": "C",
            "description": "Use class components instead of functional component.",
            "default": false
          },
          "routing": {
            "type": "boolean",
            "description": "Generate a library with routes."
          },
          "globalCss": {
            "type": "boolean",
            "description": "Default is `false`. When `true`, the component is generated with `*.css`/`*.scss` instead of `*.module.css`/`*.module.scss`.",
            "default": false
          },
          "fileName": {
            "type": "string",
            "description": "Create a component with this file name."
          }
        },
        "required": ["name", "project"],
        "presets": []
      },
      "description": "Create a React component.",
      "aliases": ["c"],
      "implementation": "/packages/react/src/generators/component/component#componentGenerator.ts",
      "hidden": false,
      "path": "/packages/react/src/generators/component/schema.json"
    },
    {
      "name": "redux",
      "factory": "./src/generators/redux/redux#reduxGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "redux",
        "title": "Create Redux state",
        "description": "Create a Redux state slice for a React project.",
        "type": "object",
        "properties": {
          "name": {
            "type": "string",
            "description": "Redux slice name.",
            "$default": { "$source": "argv", "index": 0 }
          },
          "project": {
            "type": "string",
            "description": "The name of the project to add the slice to. If it is an application, then the store configuration will be updated too.",
            "alias": "p",
            "$default": { "$source": "projectName" },
            "x-prompt": "What is the name of the project for this slice?"
          },
          "directory": {
            "type": "string",
            "alias": "dir",
            "default": "",
            "description": "The name of the folder used to contain/group the generated Redux files."
          },
          "appProject": {
            "type": "string",
            "description": "The application project to add the slice to.",
            "alias": "a"
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          }
        },
        "required": ["name"],
        "presets": []
      },
      "description": "Create a Redux slice for a project.",
      "aliases": ["slice"],
      "implementation": "/packages/react/src/generators/redux/redux#reduxGenerator.ts",
      "hidden": false,
      "path": "/packages/react/src/generators/redux/schema.json"
    },
    {
      "name": "storybook-configuration",
      "factory": "./src/generators/storybook-configuration/configuration#storybookConfigurationGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactStorybookConfigure",
        "title": "React Storybook Configure",
        "description": "Set up Storybook for a React app or library.",
        "type": "object",
        "properties": {
          "name": {
            "type": "string",
            "description": "Project name",
            "$default": { "$source": "argv", "index": 0 }
          },
          "configureCypress": {
            "type": "boolean",
            "description": "Run the cypress-configure generator.",
            "x-prompt": "Configure a cypress e2e app to run against the storybook instance?",
            "default": true
          },
          "generateStories": {
            "type": "boolean",
            "description": "Automatically generate `*.stories.ts` files for components declared in this project?",
            "x-prompt": "Automatically generate *.stories.ts files for components declared in this project?",
            "default": true
          },
          "generateCypressSpecs": {
            "type": "boolean",
            "description": "Automatically generate `*.spec.ts` files in the Cypress E2E app generated by the `cypress-configure` generator.",
            "x-prompt": "Automatically generate *.spec.ts files in the Cypress E2E app generated by the cypress-configure generator?",
            "default": true
          },
          "cypressDirectory": {
            "type": "string",
            "description": "A directory where the Cypress project will be placed. Placed at the root by default."
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript story files rather than TypeScript story files.",
            "default": false
          },
          "tsConfiguration": {
            "type": "boolean",
            "description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
            "default": false
          },
          "linter": {
            "description": "The tool to use for running lint checks.",
            "type": "string",
            "enum": ["eslint", "tslint"],
            "default": "eslint"
          },
          "standaloneConfig": {
            "description": "Split the project configuration into `<projectRoot>/project.json` rather than including it inside `workspace.json`.",
            "type": "boolean"
          }
        },
        "required": ["name"],
        "presets": []
      },
      "description": "Set up storybook for a React app or library.",
      "hidden": false,
      "implementation": "/packages/react/src/generators/storybook-configuration/configuration#storybookConfigurationGenerator.ts",
      "aliases": [],
      "path": "/packages/react/src/generators/storybook-configuration/schema.json"
    },
    {
      "name": "component-story",
      "factory": "./src/generators/component-story/component-story#componentStoryGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactComponentStory",
        "title": "Create component story",
        "description": "Generate storybook story for a react component.",
        "type": "object",
        "properties": {
          "project": {
            "type": "string",
            "description": "The project name where to add the components.",
            "examples": ["shared-ui-component"],
            "$default": { "$source": "projectName", "index": 0 },
            "x-prompt": "What's name of the project where the component lives?"
          },
          "componentPath": {
            "type": "string",
            "description": "Relative path to the component file from the library root.",
            "examples": ["lib/components"],
            "x-prompt": "What's path of the component relative to the project's lib root?"
          }
        },
        "required": ["project", "componentPath"],
        "presets": []
      },
      "description": "Generate storybook story for a React component",
      "hidden": false,
      "implementation": "/packages/react/src/generators/component-story/component-story#componentStoryGenerator.ts",
      "aliases": [],
      "path": "/packages/react/src/generators/component-story/schema.json"
    },
    {
      "name": "stories",
      "factory": "./src/generators/stories/stories#storiesGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactStorybookStories",
        "title": "Create React Storybook stories",
        "description": "Create stories/specs for all components declared in an app or a library.",
        "type": "object",
        "properties": {
          "project": {
            "type": "string",
            "description": "Library or application name.",
            "$default": { "$source": "projectName", "index": 0 },
            "x-prompt": "What's name of the project for which you want to generate stories?"
          },
          "generateCypressSpecs": {
            "type": "boolean",
            "description": "Automatically generate `*.spec.ts` files in the cypress e2e app generated by the cypress-configure generator.",
            "x-prompt": "Do you want to generate Cypress specs as well?"
          },
          "cypressProject": {
            "type": "string",
            "description": "The Cypress project to generate the stories under. This is inferred from `project` by default."
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          }
        },
        "required": ["project"],
        "presets": []
      },
      "description": "Create stories/specs for all components declared in an app or library.",
      "hidden": false,
      "implementation": "/packages/react/src/generators/stories/stories#storiesGenerator.ts",
      "aliases": [],
      "path": "/packages/react/src/generators/stories/schema.json"
    },
    {
      "name": "component-cypress-spec",
      "factory": "./src/generators/component-cypress-spec/component-cypress-spec#componentCypressGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactComponentCypressSpec",
        "title": "Create component Cypress spec",
        "description": "Create a Cypress spec for a UI component that has a story.",
        "type": "object",
        "properties": {
          "project": {
            "type": "string",
            "description": "The project name for which to generate tests.",
            "examples": ["shared-ui-component"],
            "$default": { "$source": "projectName", "index": 0 },
            "x-prompt": "What's name of the project for which to generate tests?"
          },
          "componentPath": {
            "type": "string",
            "description": "Relative path to the component file from the library root?",
            "examples": ["lib/components"],
            "x-prompt": "What's path of the component relative to the project's lib root for which to generate a test?"
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "cypressProject": {
            "type": "string",
            "description": "The Cypress project to generate the stories under. By default, inferred from `project`."
          }
        },
        "required": ["project", "componentPath"],
        "presets": []
      },
      "description": "Create a Cypress spec for a UI component that has a story.",
      "hidden": false,
      "implementation": "/packages/react/src/generators/component-cypress-spec/component-cypress-spec#componentCypressGenerator.ts",
      "aliases": [],
      "path": "/packages/react/src/generators/component-cypress-spec/schema.json"
    },
    {
      "name": "hook",
      "factory": "./src/generators/hook/hook#hookGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "cli": "nx",
        "$id": "NxReactHook",
        "title": "Create a React Hook for Nx",
        "description": "Create a React component using Hooks in a dedicated React project.",
        "type": "object",
        "examples": [
          {
            "command": "nx g hook my-hook --project=mylib",
            "description": "Generate a hook in the `mylib` library"
          }
        ],
        "properties": {
          "project": {
            "type": "string",
            "description": "The name of the project.",
            "alias": "p",
            "$default": { "$source": "projectName" },
            "x-prompt": "What is the name of the project for this hook?"
          },
          "name": {
            "type": "string",
            "description": "The name of the hook.",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use for the hook?"
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "skipTests": {
            "type": "boolean",
            "description": "When true, does not create `spec.ts` test files for the new hook.",
            "default": false
          },
          "directory": {
            "type": "string",
            "description": "Create the hook under this directory (can be nested).",
            "alias": "d"
          },
          "flat": {
            "type": "boolean",
            "description": "Create hook at the source root rather than its own directory.",
            "default": false
          },
          "export": {
            "type": "boolean",
            "description": "When true, the hook is exported from the project `index.ts` (if it exists).",
            "alias": "e",
            "default": false,
            "x-prompt": "Should this hook be exported in the project?"
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case hook file name (e.g. `useHook.ts`).",
            "alias": "P",
            "default": false
          },
          "pascalCaseDirectory": {
            "type": "boolean",
            "description": "Use pascal case directory name (e.g. `useHook/useHook.ts`).",
            "alias": "R",
            "default": false
          }
        },
        "required": ["name", "project"],
        "presets": []
      },
      "description": "Create a hook.",
      "aliases": ["c"],
      "implementation": "/packages/react/src/generators/hook/hook#hookGenerator.ts",
      "hidden": false,
      "path": "/packages/react/src/generators/hook/schema.json"
    },
    {
      "name": "host",
      "factory": "./src/generators/host/host#hostGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "$id": "GeneratorReactHost",
        "cli": "nx",
        "title": "Generate Module Federation Setup for React Host App",
        "description": "Create Module Federation configuration files for given React Host Application.",
        "type": "object",
        "properties": {
          "name": {
            "type": "string",
            "description": "The name of the host application to generate the Module Federation configuration",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use as the host application?",
            "pattern": "^[a-zA-Z].*$"
          },
          "directory": {
            "description": "The directory of the new application.",
            "type": "string",
            "alias": "dir"
          },
          "style": {
            "description": "The file extension to be used for style files.",
            "type": "string",
            "default": "css",
            "alias": "s",
            "x-prompt": {
              "message": "Which stylesheet format would you like to use?",
              "type": "list",
              "items": [
                { "value": "css", "label": "CSS" },
                {
                  "value": "scss",
                  "label": "SASS(.scss)       [ http://sass-lang.com                     ]"
                },
                {
                  "value": "styl",
                  "label": "Stylus(.styl)     [ http://stylus-lang.com                   ]"
                },
                {
                  "value": "less",
                  "label": "LESS              [ http://lesscss.org                       ]"
                },
                {
                  "value": "styled-components",
                  "label": "styled-components [ https://styled-components.com            ]"
                },
                {
                  "value": "@emotion/styled",
                  "label": "emotion           [ https://emotion.sh                       ]"
                },
                {
                  "value": "styled-jsx",
                  "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
                },
                { "value": "none", "label": "None" }
              ]
            }
          },
          "linter": {
            "description": "The tool to use for running lint checks.",
            "type": "string",
            "enum": ["eslint", "tslint"],
            "default": "eslint"
          },
          "skipFormat": {
            "description": "Skip formatting files.",
            "type": "boolean",
            "default": false
          },
          "skipWorkspaceJson": {
            "description": "Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).",
            "type": "boolean",
            "default": false
          },
          "unitTestRunner": {
            "type": "string",
            "enum": ["jest", "none"],
            "description": "Test runner to use for unit tests.",
            "default": "jest"
          },
          "e2eTestRunner": {
            "type": "string",
            "enum": ["cypress", "none"],
            "description": "Test runner to use for end to end (e2e) tests.",
            "default": "cypress"
          },
          "tags": {
            "type": "string",
            "description": "Add tags to the application (used for linting).",
            "alias": "t"
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case component file name (e.g. App.tsx).",
            "alias": "P",
            "default": false
          },
          "classComponent": {
            "type": "boolean",
            "description": "Use class components instead of functional component.",
            "alias": "C",
            "default": false
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "globalCss": {
            "type": "boolean",
            "description": "Default is false. When true, the component is generated with *.css/*.scss instead of *.module.css/*.module.scss",
            "default": false
          },
          "strict": {
            "type": "boolean",
            "description": "Creates an application with strict mode and strict type checking",
            "default": true
          },
          "setParserOptionsProject": {
            "type": "boolean",
            "description": "Whether or not to configure the ESLint \"parserOptions.project\" option. We do not do this by default for lint performance reasons.",
            "default": false
          },
          "standaloneConfig": {
            "description": "Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json",
            "type": "boolean"
          },
          "compiler": {
            "type": "string",
            "description": "The compiler to use",
            "enum": ["babel", "swc"],
            "default": "babel"
          },
          "remotes": {
            "type": "array",
            "description": "A list of remote application names that the host application should consume.",
            "default": []
          },
          "devServerPort": {
            "type": "number",
            "description": "The port for the dev server of the remote app."
          }
        },
        "required": ["name"],
        "additionalProperties": false,
        "presets": []
      },
      "x-type": "application",
      "description": "Generate a host react application",
      "implementation": "/packages/react/src/generators/host/host#hostGenerator.ts",
      "aliases": [],
      "hidden": false,
      "path": "/packages/react/src/generators/host/schema.json"
    },
    {
      "name": "remote",
      "factory": "./src/generators/remote/remote#remoteGenerator",
      "schema": {
        "$schema": "http://json-schema.org/schema",
        "$id": "GeneratorReactRemote",
        "cli": "nx",
        "title": "Generate Module Federation Setup for React Remote App",
        "description": "Create Module Federation configuration files for given React Remote Application.",
        "type": "object",
        "properties": {
          "name": {
            "type": "string",
            "description": "The name of the remote application to generate the Module Federation configuration",
            "$default": { "$source": "argv", "index": 0 },
            "x-prompt": "What name would you like to use as the remote application?",
            "pattern": "^[a-zA-Z].*$"
          },
          "directory": {
            "description": "The directory of the new application.",
            "type": "string",
            "alias": "dir"
          },
          "style": {
            "description": "The file extension to be used for style files.",
            "type": "string",
            "default": "css",
            "alias": "s",
            "x-prompt": {
              "message": "Which stylesheet format would you like to use?",
              "type": "list",
              "items": [
                { "value": "css", "label": "CSS" },
                {
                  "value": "scss",
                  "label": "SASS(.scss)       [ http://sass-lang.com                     ]"
                },
                {
                  "value": "styl",
                  "label": "Stylus(.styl)     [ http://stylus-lang.com                   ]"
                },
                {
                  "value": "less",
                  "label": "LESS              [ http://lesscss.org                       ]"
                },
                {
                  "value": "styled-components",
                  "label": "styled-components [ https://styled-components.com            ]"
                },
                {
                  "value": "@emotion/styled",
                  "label": "emotion           [ https://emotion.sh                       ]"
                },
                {
                  "value": "styled-jsx",
                  "label": "styled-jsx        [ https://www.npmjs.com/package/styled-jsx ]"
                },
                { "value": "none", "label": "None" }
              ]
            }
          },
          "linter": {
            "description": "The tool to use for running lint checks.",
            "type": "string",
            "enum": ["eslint", "tslint"],
            "default": "eslint"
          },
          "routing": {
            "type": "boolean",
            "description": "Generate application with routes.",
            "default": false
          },
          "skipFormat": {
            "description": "Skip formatting files.",
            "type": "boolean",
            "default": false
          },
          "skipWorkspaceJson": {
            "description": "Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).",
            "type": "boolean",
            "default": false
          },
          "unitTestRunner": {
            "type": "string",
            "enum": ["jest", "none"],
            "description": "Test runner to use for unit tests.",
            "default": "jest"
          },
          "e2eTestRunner": {
            "type": "string",
            "enum": ["cypress", "none"],
            "description": "Test runner to use for end to end (e2e) tests.",
            "default": "cypress"
          },
          "tags": {
            "type": "string",
            "description": "Add tags to the application (used for linting).",
            "alias": "t"
          },
          "pascalCaseFiles": {
            "type": "boolean",
            "description": "Use pascal case component file name (e.g. App.tsx).",
            "alias": "P",
            "default": false
          },
          "classComponent": {
            "type": "boolean",
            "description": "Use class components instead of functional component.",
            "alias": "C",
            "default": false
          },
          "js": {
            "type": "boolean",
            "description": "Generate JavaScript files rather than TypeScript files.",
            "default": false
          },
          "globalCss": {
            "type": "boolean",
            "description": "Default is false. When true, the component is generated with *.css/*.scss instead of *.module.css/*.module.scss.",
            "default": false
          },
          "strict": {
            "type": "boolean",
            "description": "Creates an application with strict mode and strict type checking.",
            "default": true
          },
          "setParserOptionsProject": {
            "type": "boolean",
            "description": "Whether or not to configure the ESLint \"parserOptions.project\" option. We do not do this by default for lint performance reasons.",
            "default": false
          },
          "standaloneConfig": {
            "description": "Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json",
            "type": "boolean"
          },
          "compiler": {
            "type": "string",
            "description": "The compiler to use.",
            "enum": ["babel", "swc"],
            "default": "babel"
          },
          "host": {
            "type": "string",
            "description": "The host / shell application for this remote."
          },
          "devServerPort": {
            "type": "number",
            "description": "The port for the dev server of the remote app."
          }
        },
        "required": ["name"],
        "additionalProperties": false,
        "presets": []
      },
      "x-type": "application",
      "description": "Generate a remote react application",
      "implementation": "/packages/react/src/generators/remote/remote#remoteGenerator.ts",
      "aliases": [],
      "hidden": false,
      "path": "/packages/react/src/generators/remote/schema.json"
    }
  ],
  "executors": [
    {
      "name": "module-federation-dev-server",
      "implementation": "/packages/react/src/executors/module-federation-dev-server/module-federation-dev-server.impl.ts",
      "schema": {
        "title": "Module Federation Dev Server",
        "description": "Serve a web application.",
        "cli": "nx",
        "type": "object",
        "properties": {
          "devRemotes": {
            "type": "array",
            "items": { "type": "string" },
            "description": "List of remote applications to run in development mode (i.e. using serve target)."
          },
          "buildTarget": {
            "type": "string",
            "description": "Target which builds the application."
          },
          "port": {
            "type": "number",
            "description": "Port to listen on.",
            "default": 4200
          },
          "host": {
            "type": "string",
            "description": "Host to listen on.",
            "default": "localhost"
          },
          "ssl": {
            "type": "boolean",
            "description": "Serve using `HTTPS`.",
            "default": false
          },
          "sslKey": {
            "type": "string",
            "description": "SSL key to use for serving `HTTPS`."
          },
          "sslCert": {
            "type": "string",
            "description": "SSL certificate to use for serving `HTTPS`."
          },
          "watch": {
            "type": "boolean",
            "description": "Watches for changes and rebuilds application.",
            "default": true
          },
          "liveReload": {
            "type": "boolean",
            "description": "Whether to reload the page on change, using live-reload.",
            "default": true
          },
          "hmr": {
            "type": "boolean",
            "description": "Enable hot module replacement.",
            "default": false
          },
          "publicHost": {
            "type": "string",
            "description": "Public URL where the application will be served."
          },
          "open": {
            "type": "boolean",
            "description": "Open the application in the browser.",
            "default": false
          },
          "allowedHosts": {
            "type": "string",
            "description": "This option allows you to whitelist services that are allowed to access the dev server."
          },
          "memoryLimit": {
            "type": "number",
            "description": "Memory limit for type checking service process in `MB`."
          },
          "maxWorkers": {
            "type": "number",
            "description": "Number of workers to use for type checking."
          },
          "baseHref": {
            "type": "string",
            "description": "Base url for the application being built."
          }
        },
        "presets": []
      },
      "description": "Serve a host or remote application.",
      "aliases": [],
      "hidden": false,
      "path": "/packages/react/src/executors/module-federation-dev-server/schema.json"
    }
  ]
}