<!-- 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>
126 lines
5.3 KiB
JSON
126 lines
5.3 KiB
JSON
{
|
|
"name": "component",
|
|
"factory": "./src/generators/component/component",
|
|
"schema": {
|
|
"$schema": "http://json-schema.org/draft-07/schema",
|
|
"$id": "SchematicsAngularComponent",
|
|
"title": "Angular Component Schema",
|
|
"cli": "nx",
|
|
"type": "object",
|
|
"description": "Creates a new Angular component.",
|
|
"additionalProperties": false,
|
|
"properties": {
|
|
"path": {
|
|
"type": "string",
|
|
"description": "The path at which to create the component file, relative to the workspace root. By default, it is set to the root of the project.",
|
|
"$default": { "$source": "argv", "index": 0 },
|
|
"x-prompt": "Where to create the component?"
|
|
},
|
|
"name": {
|
|
"type": "string",
|
|
"description": "The name of the component.",
|
|
"x-prompt": "What name would you like to use for the component?"
|
|
},
|
|
"prefix": {
|
|
"type": "string",
|
|
"description": "The prefix to apply to the generated component selector.",
|
|
"alias": "p"
|
|
},
|
|
"displayBlock": {
|
|
"description": "Specifies if the style will contain `:host { display: block; }`.",
|
|
"type": "boolean",
|
|
"default": false,
|
|
"alias": "b"
|
|
},
|
|
"inlineStyle": {
|
|
"description": "Include styles inline in the component.ts file. Only CSS styles can be included inline. By default, an external styles file is created and referenced in the component.ts file.",
|
|
"type": "boolean",
|
|
"default": false,
|
|
"alias": "s"
|
|
},
|
|
"inlineTemplate": {
|
|
"description": "Include template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file.",
|
|
"type": "boolean",
|
|
"default": false,
|
|
"alias": "t"
|
|
},
|
|
"standalone": {
|
|
"description": "Whether the generated component is standalone.",
|
|
"type": "boolean",
|
|
"default": true,
|
|
"x-priority": "important"
|
|
},
|
|
"viewEncapsulation": {
|
|
"description": "The view encapsulation strategy to use in the new component.",
|
|
"enum": ["Emulated", "None", "ShadowDom"],
|
|
"type": "string",
|
|
"alias": "v"
|
|
},
|
|
"changeDetection": {
|
|
"description": "The change detection strategy to use in the new component.",
|
|
"enum": ["Default", "OnPush"],
|
|
"type": "string",
|
|
"default": "Default",
|
|
"alias": "c"
|
|
},
|
|
"module": {
|
|
"type": "string",
|
|
"description": "The filename or path to the NgModule that will declare this component.",
|
|
"alias": "m"
|
|
},
|
|
"style": {
|
|
"description": "The file extension or preprocessor to use for style files, or `none` to skip generating the style file.",
|
|
"type": "string",
|
|
"default": "css",
|
|
"enum": ["css", "scss", "sass", "less", "none"]
|
|
},
|
|
"skipTests": {
|
|
"type": "boolean",
|
|
"description": "Do not create `spec.ts` test files for the new component.",
|
|
"default": false
|
|
},
|
|
"skipImport": {
|
|
"type": "boolean",
|
|
"description": "Do not import this component into the owning NgModule.",
|
|
"default": false
|
|
},
|
|
"selector": {
|
|
"type": "string",
|
|
"format": "html-selector",
|
|
"description": "The HTML selector to use for this component."
|
|
},
|
|
"skipSelector": {
|
|
"type": "boolean",
|
|
"default": false,
|
|
"description": "Specifies if the component should have a selector or not."
|
|
},
|
|
"type": {
|
|
"type": "string",
|
|
"description": "Adds a developer-defined type to the filename, in the format `name.type.ts`.",
|
|
"default": "component"
|
|
},
|
|
"export": {
|
|
"type": "boolean",
|
|
"description": "Specifies if the component should be exported in the declaring `NgModule`. Additionally, if the project is a library, the component will be exported from the project's entry point (normally `index.ts`) if the module it belongs to is also exported or if the component is standalone.",
|
|
"default": false,
|
|
"x-priority": "important"
|
|
},
|
|
"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`:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component\n```\n\n{% /tab %}\n\n{% tab label=\"Single File Component\" %}\n\nCreate a component named `my-component` with inline styles and inline template:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --inlineStyle --inlineTemplate\n```\n\n{% /tab %}\n\n{% tab label=\"Component with OnPush Change Detection Strategy\" %}\n\nCreate a component named `my-component` with OnPush Change Detection Strategy:\n\n```bash\nnx g @nx/angular:component apps/my-app/src/lib/my-component/my-component --changeDetection=OnPush\n```\n\n{% /tab %}\n",
|
|
"presets": []
|
|
},
|
|
"aliases": ["c"],
|
|
"description": "Generate an Angular Component.",
|
|
"implementation": "/packages/angular/src/generators/component/component.ts",
|
|
"hidden": false,
|
|
"path": "/packages/angular/src/generators/component/schema.json",
|
|
"type": "generator"
|
|
}
|