bc8b71ac6c
<!-- Please make sure you have read the submission guidelines before posting an PR --> <!-- https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr --> <!-- Please make sure that your commit message follows our format --> <!-- Example: `fix(nx): must begin with lowercase` --> <!-- If this is a particularly complex change or feature addition, you can request a dedicated Nx release for this pull request branch. Mention someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they will confirm if the PR warrants its own release for testing purposes, and generate it for you if appropriate. --> ## Current Behavior <!-- This is the behavior we have today --> Currently, when we use generator's via the CLI passing the `name` arg has more than one responsibility: 1. it can be used as a path 2. it can be used as the generator's name (e.g. Component name) This is not intuitive as if we use via Nx Console because it creates some ambiguity around the `--name` property which is normally described as only 2.  ## Expected Behavior <!-- This is the behavior we should expect with the changes in this PR --> What is expected is that the `name` property should only have the responsibility of determining the name of the generated module (Component, Directive etc...). The new property `path` replaces the `directory` property but fulfils the same purpose as determining where the module should be created. ## Related Issue(s) <!-- Please link the issue being fixed so it gets closed when this is merged. --> Fixes # --------- Co-authored-by: Jack Hsu <jack.hsu@gmail.com>
119 lines
4.4 KiB
JSON
119 lines
4.4 KiB
JSON
{
|
|
"name": "component",
|
|
"factory": "./src/generators/component/component",
|
|
"schema": {
|
|
"$schema": "https://json-schema.org/schema",
|
|
"cli": "nx",
|
|
"$id": "NxReactComponent",
|
|
"title": "Create a React Component",
|
|
"description": "Create a React Component for Nx.",
|
|
"type": "object",
|
|
"properties": {
|
|
"path": {
|
|
"type": "string",
|
|
"description": "Path where the component will be generated.",
|
|
"$default": { "$source": "argv", "index": 0 },
|
|
"x-prompt": "Where should the component be generated?",
|
|
"x-priority": "important"
|
|
},
|
|
"name": {
|
|
"type": "string",
|
|
"description": "The name of the component.",
|
|
"x-prompt": "What name would you like to use for the component?",
|
|
"x-priority": "important"
|
|
},
|
|
"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) [ https://sass-lang.com ]"
|
|
},
|
|
{
|
|
"value": "less",
|
|
"label": "LESS [ https://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,
|
|
"x-priority": "internal"
|
|
},
|
|
"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?"
|
|
},
|
|
"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."
|
|
},
|
|
"inSourceTests": {
|
|
"type": "boolean",
|
|
"default": false,
|
|
"description": "When using Vitest, separate spec files will not be generated and instead will be included within the source files. Read more on the Vitest docs site: https://vitest.dev/guide/in-source.html"
|
|
},
|
|
"skipFormat": {
|
|
"description": "Skip formatting files.",
|
|
"type": "boolean",
|
|
"default": false,
|
|
"x-priority": "internal"
|
|
}
|
|
},
|
|
"required": ["path"],
|
|
"examplesFile": "## Examples\n\n{% tabs %}\n{% tab label=\"Simple Component\" %}\n\nCreate a component named `my-component` under the `libs/ui` project:\n\n```shell\nnx g @nx/react:component libs/ui/src/my-component\n```\n\n{% /tab %}\n\n{% tab label=\"Standalone Component\" %}\n\nCreate a class component named `my-component` under the `libs/ui` project:\n\n```shell\nnx g @nx/react:component libs/ui/src/my-component --classComponent\n```\n\n{% /tab %}\n",
|
|
"presets": []
|
|
},
|
|
"description": "Create a React component.",
|
|
"aliases": ["c"],
|
|
"implementation": "/packages/react/src/generators/component/component.ts",
|
|
"hidden": false,
|
|
"path": "/packages/react/src/generators/component/schema.json",
|
|
"type": "generator"
|
|
}
|