@nx/angular:component
Creates a new Angular component.
The State of JS survey is live, featuring a monorepo tools sectionThe State of JS survey is live, featuring a monorepo tools sectionVote for us
Creates a new Angular component.
Create a component named my-component
:
1nx g @nx/angular:component my-component
2
1nx generate component ...
2
1nx g c ... #same
2
By default, Nx will search for component
in the default collection provisioned in workspace.json.
You can specify the collection explicitly as follows:
1nx g @nx/angular:component ...
2
Show what will be generated without writing to disk:
1nx g component ... --dry-run
2
The name of the component.
The directory at which to create the component file. When --nameAndDirectoryFormat=as-provided
, it will be relative to the current working directory. Otherwise, it will be relative to the workspace root.
false
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.
true
Whether the generated component is standalone.
Default
Default
, OnPush
The change detection strategy to use in the new component.
false
Specifies if the style will contain :host { display: block; }
.
false
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.
false
Include template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file.
The filename or path to the NgModule that will declare this component.
as-provided
, derived
Whether to generate the component in the directory as provided, relative to the current working directory and ignoring the project (as-provided
) or generate it using the project and directory relative to the workspace root (derived
).
The prefix to apply to the generated component selector.
css
css
, scss
, sass
, less
, none
The file extension or preprocessor to use for style files, or none
to skip generating the style file.
false
Do not create spec.ts
test files for the new component.
false
Do not import this component into the owning NgModule.
html-selector
The HTML selector to use for this component.
false
Specifies if the component should have a selector or not.
component
Adds a developer-defined type to the filename, in the format name.type.ts
.
Emulated
, None
, ShadowDom
The view encapsulation strategy to use in the new component.
false
Skip formatting files.
false
Create the new files at the top level of the current project.
Provide the directory
option instead and use the as-provided
format. It will be removed in Nx v18.
The name of the project.
Provide the directory
option instead and use the as-provided
format. The project will be determined from the directory provided. It will be removed in Nx v18.