ng generate
Generates and/or modifies files based on a schematic.
ng generate <schematic>
ng g <schematic>
This command has the following sub-commands:
- app-shell
- application
- class
- component
- config
- directive
- enum
- environments
- guard
- interceptor
- interface
- library
- module
- pipe
- resolver
- service
- service-worker
- web-worker
Arguments
Argument | Description | Value Type |
---|---|---|
schematic |
The [collection:schematic] to run. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--defaults
|
Disable interactive input prompts for options with a default. |
boolean |
false |
--dry-run
|
Run through and reports activity without writing out results. Aliases: -d |
boolean |
false |
--force
|
Force overwriting of existing files. |
boolean |
false |
--help
|
Shows a help message for this command in the console. |
boolean |
|
--interactive
|
Enable interactive input prompts. |
boolean |
true |
Generate commands
app-shell
ng generate app-shell
Generates an application shell for running a server-side version of an app.
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the related client app. |
string |
application
ng generate application [name]
ng generate app [name]
Generates a new basic application definition in the "projects" subfolder of the workspace.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the new application. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--inline-style
|
Include styles inline in the root component.ts file. Only CSS styles can be included inline. Default is false, meaning that an external styles file is created and referenced in the root component.ts file. Aliases: -s |
boolean |
|
--inline-template
|
Include template inline in the root component.ts file. Default is false, meaning that an external template file is created and referenced in the root component.ts file. Aliases: -t |
boolean |
|
--minimal
|
Create a bare-bones project without any testing frameworks. (Use for learning purposes only.) |
boolean |
false |
--prefix
|
A prefix to apply to generated selectors. Aliases: -p |
string |
app |
--project-root
|
The root directory of the new application. |
string |
|
--routing
|
Creates an application with routing enabled. |
boolean |
true |
--skip-install
|
Skip installing dependency packages. |
boolean |
false |
--skip-package-json
|
Do not add dependencies to the "package.json" file. |
boolean |
false |
--skip-tests
|
Do not create "spec.ts" test files for the application. Aliases: -S |
boolean |
false |
--ssr
|
Creates an application with Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering) enabled. |
boolean |
false |
--standalone
|
Creates an application based upon the standalone API, without NgModules. |
boolean |
true |
--strict
|
Creates an application with stricter bundle budgets settings. |
boolean |
true |
--style
|
The file extension or preprocessor to use for style files. |
css | scss | sass | less |
css |
--view-encapsulation
|
The view encapsulation strategy to use in the new application. |
Emulated | None | ShadowDom |
class
ng generate class [name]
ng generate cl [name]
Creates a new, generic class definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the new class. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project. |
string |
|
--skip-tests
|
Do not create "spec.ts" test files for the new class. |
boolean |
false |
--type
|
Adds a developer-defined type to the filename, in the format "name.type.ts". |
string |
component
ng generate component [name]
ng generate c [name]
Creates a new, generic component definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the component. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--change-detection
|
The change detection strategy to use in the new component. Aliases: -c |
Default | OnPush |
Default |
--display-block
|
Specifies if the style will contain Aliases: -b |
boolean |
false |
--export
|
The declaring NgModule exports this component. |
boolean |
false |
--flat
|
Create the new files at the top level of the current project. |
boolean |
false |
--inline-style
|
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. Aliases: -s |
boolean |
false |
--inline-template
|
Include template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file. Aliases: -t |
boolean |
false |
--module
|
The declaring NgModule. Aliases: -m |
string |
|
--prefix
|
The prefix to apply to the generated component selector. Aliases: -p |
string |
|
--project
|
The name of the project. |
string |
|
--selector
|
The HTML selector to use for this component. |
string |
|
--skip-import
|
Do not import this component into the owning NgModule. |
boolean |
false |
--skip-selector
|
Specifies if the component should have a selector or not. |
boolean |
false |
--skip-tests
|
Do not create "spec.ts" test files for the new component. |
boolean |
false |
--standalone
|
Whether the generated component is standalone. |
boolean |
true |
--style
|
The file extension or preprocessor to use for style files, or 'none' to skip generating the style file. |
css | scss | sass | less | none |
css |
--type
|
Adds a developer-defined type to the filename, in the format "name.type.ts". |
string |
Component |
--view-encapsulation
|
The view encapsulation strategy to use in the new component. Aliases: -v |
Emulated | None | ShadowDom |
config
ng generate config [type]
Generates a configuration file in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
type |
Specifies which type of configuration file to create. |
karma | browserslist |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project. |
string |
directive
ng generate directive [name]
ng generate d [name]
Creates a new, generic directive definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the new directive. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--export
|
The declaring NgModule exports this directive. |
boolean |
false |
--flat
|
When true (the default), creates the new files at the top level of the current project. |
boolean |
true |
--module
|
The declaring NgModule. Aliases: -m |
string |
|
--prefix
|
A prefix to apply to generated selectors. Aliases: -p |
string |
|
--project
|
The name of the project. |
string |
|
--selector
|
The HTML selector to use for this directive. |
string |
|
--skip-import
|
Do not import this directive into the owning NgModule. |
boolean |
false |
--skip-tests
|
Do not create "spec.ts" test files for the new class. |
boolean |
false |
--standalone
|
Whether the generated directive is standalone. |
boolean |
true |
enum
ng generate enum [name]
ng generate e [name]
Generates a new, generic enum definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the enum. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project in which to create the enum. Default is the configured default project for the workspace. |
string |
|
--type
|
Adds a developer-defined type to the filename, in the format "name.type.ts". |
string |
environments
ng generate environments
Generates and configures environment files for a project.
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project. |
string |
guard
ng generate guard [name]
ng generate g [name]
Generates a new, generic route guard definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the new route guard. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--flat
|
When true (the default), creates the new files at the top level of the current project. |
boolean |
true |
--functional
|
Specifies whether to generate a guard as a function. |
boolean |
true |
--implements
|
Specifies which type of guard to create. Aliases: --guardType |
array |
|
--project
|
The name of the project. |
string |
|
--skip-tests
|
Do not create "spec.ts" test files for the new guard. |
boolean |
false |
interceptor
ng generate interceptor [name]
Creates a new, generic interceptor definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the interceptor. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--flat
|
When true (the default), creates files at the top level of the project. |
boolean |
true |
--functional
|
Creates the interceptor as a |
boolean |
true |
--project
|
The name of the project. |
string |
|
--skip-tests
|
Do not create "spec.ts" test files for the new interceptor. |
boolean |
false |
interface
ng generate interface [name] [type]
ng generate i [name] [type]
Creates a new, generic interface definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the interface. |
string |
type |
Adds a developer-defined type to the filename, in the format "name.type.ts". |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--prefix
|
A prefix to apply to generated selectors. |
string |
|
--project
|
The name of the project. |
string |
library
ng generate library [name]
ng generate lib [name]
Creates a new, generic library project in the current workspace.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the library. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--entry-file
|
The path at which to create the library's public API file, relative to the workspace root. |
string |
public-api |
--prefix
|
A prefix to apply to generated selectors. Aliases: -p |
string |
lib |
--project-root
|
The root directory of the new library. |
string |
|
--skip-install
|
Do not install dependency packages. |
boolean |
false |
--skip-package-json
|
Do not add dependencies to the "package.json" file. |
boolean |
false |
--skip-ts-config
|
Do not update "tsconfig.json" to add a path mapping for the new library. The path mapping is needed to use the library in an app, but can be disabled here to simplify development. |
boolean |
false |
--standalone
|
Creates a library based upon the standalone API, without NgModules. |
boolean |
true |
module
ng generate module [name]
ng generate m [name]
Creates a new, generic NgModule definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the NgModule. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--flat
|
Create the new files at the top level of the current project root. |
boolean |
false |
--module
|
The declaring NgModule. Aliases: -m |
string |
|
--project
|
The name of the project. |
string |
|
--route
|
The route path for a lazy-loaded module. When supplied, creates a component in the new module, and adds the route to that component in the |
string |
|
--routing
|
Create a routing module. |
boolean |
false |
--routing-scope
|
The scope for the new routing module. |
Child | Root |
Child |
pipe
ng generate pipe [name]
ng generate p [name]
Creates a new, generic pipe definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the pipe. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--export
|
The declaring NgModule exports this pipe. |
boolean |
false |
--flat
|
When true (the default) creates files at the top level of the project. |
boolean |
true |
--module
|
The declaring NgModule. Aliases: -m |
string |
|
--project
|
The name of the project. |
string |
|
--skip-import
|
Do not import this pipe into the owning NgModule. |
boolean |
false |
--skip-tests
|
Do not create "spec.ts" test files for the new pipe. |
boolean |
false |
--standalone
|
Whether the generated pipe is standalone. |
boolean |
true |
resolver
ng generate resolver [name]
ng generate r [name]
Generates a new, generic resolver definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the new resolver. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--flat
|
When true (the default), creates the new files at the top level of the current project. |
boolean |
true |
--functional
|
Creates the resolver as a |
boolean |
true |
--project
|
The name of the project. |
string |
|
--skip-tests
|
Do not create "spec.ts" test files for the new resolver. |
boolean |
false |
service
ng generate service [name]
ng generate s [name]
Creates a new, generic service definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the service. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--flat
|
When true (the default), creates files at the top level of the project. |
boolean |
true |
--project
|
The name of the project. |
string |
|
--skip-tests
|
Do not create "spec.ts" test files for the new service. |
boolean |
false |
service-worker
ng generate service-worker
Pass this schematic to the "run" command to create a service worker
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project. |
string |
|
--target
|
The target to apply service worker to. |
string |
build |
web-worker
ng generate web-worker [name]
Creates a new, generic web worker definition in the given project.
Arguments
Argument | Description | Value Type |
---|---|---|
name |
The name of the worker. |
string |
Options
Option | Description | Value Type | Default Value |
---|---|---|---|
--project
|
The name of the project. |
string |
|
--snippet
|
Add a worker creation snippet in a sibling file of the same name. |
boolean |
true |