@nx/angularSee schema

@nx/angular:component

Creates a new Angular component.

Examples

Generate a component named Card at apps/my-app/src/lib/card/card.ts:

1nx g @nx/angular:component apps/my-app/src/lib/card/card.ts 2

Usage

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

Options

path

Required
string

The file path to the component. Relative to the current working directory.

export

boolean
Default: 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.

standalone

boolean
Default: true

Whether the generated component is standalone.

changeDetection

c
string
Default: Default
Accepted values: Default, OnPush

The change detection strategy to use in the new component.

displayBlock

b
boolean
Default: false

Specifies if the style will contain :host { display: block; }.

exportDefault

boolean
Default: false

Use default export for the component instead of a named export.

inlineStyle

s
boolean
Default: 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.

inlineTemplate

t
boolean
Default: false

Include template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file.

module

m
string

The filename or path to the NgModule that will declare this component.

name

string

The component symbol name. Defaults to the last segment of the file path.

ngHtml

boolean
Default: false

Generate component template files with an '.ng.html' file extension instead of '.html'.

prefix

p
string

The prefix to apply to the generated component selector.

style

string
Default: css
Accepted values: css, scss, sass, less, none

The file extension or preprocessor to use for style files, or none to skip generating the style file.

skipTests

boolean
Default: false

Do not create spec.ts test files for the new component.

skipImport

boolean
Default: false

Do not import this component into the owning NgModule.

selector

string
Format: html-selector

The HTML selector to use for this component.

skipSelector

boolean
Default: false

Specifies if the component should have a selector or not.

type

string

Append a custom type to the component's filename. It defaults to 'component' for Angular versions below v20. For Angular v20 and above, no type is appended unless specified.

viewEncapsulation

v
string
Accepted values: Emulated, None, ShadowDom

The view encapsulation strategy to use in the new component.

skipFormat

Internal
boolean
Default: false

Skip formatting files.