How to use the Angular CLI generate command line

Creates a new, generic NgModule definition in the given or default project.

CREATE src/app/page/edit/edit.module.ts (190 bytes)

Creates a new, generic component definition in the given or default project.

CREATE src/app/page/edit/edit.component.scss (0 bytes)
CREATE src/app/page/edit/edit.component.html (19 bytes)
CREATE src/app/page/edit/edit.component.spec.ts (612 bytes)
CREATE src/app/page/edit/edit.component.ts (268 bytes)
UPDATE src/app/page/edit/edit.module.ts (261 bytes)

The Angular CLI generate Help Commands and Options

Usage: 
  ng generate <schematic> [options]
  ng g <schematic> [options]

Arguments:
<schematic>
The schematic or collection:schematic to generate.This option can take one of the following sub-commands:app-shell、application、class、component、directive、enum、guard、interceptor、interface、library、module、pipe、resolver、service、service-worker、web-worker
Options:
--defaults
Disable interactive input prompts for options with a default.
--dry-run default:false
Run through and reports activity without writing out results. Aliases: -d
--force default:false
Force overwriting of existing files. Aliases: -f
--help default:false
Shows a help message for this command in the console.
--interactive
Enable interactive input prompts.

Schematic commands: app-shell

Generates an app shell for running a server-side version of an app.

Usage: 
  ng generate app-shell [options]
  ng g app-shell [options]

Options:
--app-dir default:app
The name of the application directory.
--app-id default:serverApp
The app ID to use in withServerTransition().
--main default:main.server.ts
The name of the main entry-point file.
--project
The name of the related client app.
--root-module-class-name default:AppServerModule
The name of the root module class.
--root-module-file-name default:app.server.module.ts
The name of the root module file
--route default:shell
Route path used to produce the app shell.

Schematic commands: application

Generates a new basic app definition in the "projects" subfolder of the workspace.

Usage: 
  ng generate application <name> [options]
  ng g application <name> [options]

Arguments:
<name>
The name of the new app.
Options:
--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
--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
--legacy-browsers default:false
Deprecated: Legacy browsers support is deprecated since version 12.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the application.
--minimal default:false
Create a bare-bones project without any testing frameworks. (Use for learning purposes only.)
--prefix default:app
A prefix to apply to generated selectors. Aliases: -p
--routing default:false
Create a routing NgModule.
--skip-install default:false
Skip installing dependency packages.
--skip-package-json default:false
Do not add dependencies to the "package.json" file.
--skip-tests default:false
Do not create "spec.ts" test files for the application. Aliases: -S
--strict default:true
Creates an application with stricter bundle budgets settings.
--style default:css
The file extension or preprocessor to use for style files.
--view-encapsulation
The view encapsulation strategy to use in the new app.

Schematic commands: class

Creates a new, generic class definition in the given or default project.

Usage: 
  ng generate class <name> [options]
  ng g class <name> [options]

Arguments:
<name>
The name of the new class.
Options:
--lint-fix default:false
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the class.
--project
The name of the project.
--skip-tests default:false
Do not create "spec.ts" test files for the new class.
--type
Adds a developer-defined type to the filename, in the format "name.type.ts".

Schematic commands: component

Creates a new, generic class definition in the given or default project.

Usage: 
  ng generate component <name> [options]
  ng g component <name> [options]
  ng g c <name> [options]

Arguments:
<name>
The name of the component.
Options:
--change-detection default:Default
The change detection strategy to use in the new component. Aliases: -c
--display-block default:false
Specifies if the style will contain :host { display: block; }. Aliases: -b
--export default:false
The declaring NgModule exports this component.
--flat default:false
Create the new files at the top level of the current project.
--inline-style 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. Aliases: -s
--inline-template 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. Aliases: -t
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the component.
--module
The declaring NgModule. Aliases: -m
--prefix
The prefix to apply to the generated component selector. Aliases: -p
--project
The name of the project.
--selector
The HTML selector to use for this component.
--skip-import default:false
Do not import this component into the owning NgModule.
--skip-selector default:false
Specifies if the component should have a selector or not.
--skip-tests default:false
Do not create "spec.ts" test files for the new component.
--style default:css
The file extension or preprocessor to use for style files.
--type default:Component
Adds a developer-defined type to the filename, in the format "name.type.ts".
--view-encapsulation
The view encapsulation strategy to use in the new component. Aliases: -v

Schematic commands: directive

Creates a new, generic directive definition in the given or default project.

Usage: 
  ng generate directive <name> [options]
  ng g directive <name> [options]

Arguments:
<name>
The name of the new directive.
Options:
--export default:false
The declaring NgModule exports this directive.
--flat default:true
When true (the default), creates the new files at the top level of the current project.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the directive.
--module
The declaring NgModule. Aliases: -m
--prefix
A prefix to apply to generated selectors. Aliases: -p
--project
The name of the project.
--selector
The HTML selector to use for this directive.
--skip-import default:false
Do not import this directive into the owning NgModule.
--skip-tests default:false
Do not create "spec.ts" test files for the new class.

Schematic commands: enum

Generates a new, generic enum definition for the given or default project.

Usage: 
  ng generate enum <name> [options]
  ng g enum <name> [options]

Arguments:
<name>
The name of the enum.
Options:
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the enum.
--project
The name of the project in which to create the enum. Default is the configured default project for the workspace.
--type
Adds a developer-defined type to the filename, in the format "name.type.ts".

Schematic commands: guard

Generates a new, generic route guard definition in the given or default project.

Usage: 
  ng generate guard <name> [options]
  ng g guard <name> [options]

Arguments:
<name>
The name of the new route guard.
Options:
--flat default:true
When true (the default), creates the new files at the top level of the current project.
--implements
Specifies which interfaces to implement.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the guard.
--project
The name of the project.
--skip-tests default:false
Do not create "spec.ts" test files for the new guard.

Schematic commands: interceptor

Creates a new, generic interceptor definition in the given or default project.

Usage: 
  ng generate interceptor <name> [options]
  ng g interceptor <name> [options]

Arguments:
<name>
The name of the interceptor.
Options:
--flat default:true
When true (the default), creates files at the top level of the project.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the interceptor.
--project
The name of the project.
--skip-tests default:false
Do not create "spec.ts" test files for the new interceptor.

Schematic commands: interface

Creates a new, generic interface definition in the given or default project.

Usage: 
  ng generate interface <name> <type> [options]
  ng g interface <name> <type> [options]

Arguments:
<name>
The name of the interface.
<type>
Adds a developer-defined type to the filename, in the format "name.type.ts".
Options:
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the interface.
--prefix
A prefix to apply to generated selectors.
--project
The name of the project.

Schematic commands: library

Creates a new, generic library project in the current workspace.

Usage: 
  ng generate library <name> [options]
  ng g library <name> [options]

Arguments:
<name>
The name of the library.
Options:
--entry-file default:public-api
The path at which to create the library's public API file, relative to the workspace root.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the library.
--prefix default:lib
A prefix to apply to generated selectors. Aliases: -p
--skip-install default:false
Do not install dependency packages.
--skip-package-json default:false
Do not add dependencies to the "package.json" file.
--skip-ts-config default:false
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.

Schematic commands: module

Creates a new, generic NgModule definition in the given or default project.

Usage: 
  ng generate module <name> [options]
  ng g module <name> [options]
  ng g m <name> [options]

Arguments:
<name>
The name of the NgModule.
Options:
--flat default:false
Create the new files at the top level of the current project root.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the module.
--module
The declaring NgModule. Aliases: -m
--project
The name of the project.
--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 Routes array declared in the module provided in the --module option.
--routing default:false
Create a routing module.
--routing-scope default:Child
The scope for the new routing module.

Schematic commands: pipe

Creates a new, generic pipe definition in the given or default project.

Usage: 
  ng generate pipe <name> [options]
  ng g pipe <name> [options]

Arguments:
<name>
The name of the pipe.
Options:
--export default:false
The declaring NgModule exports this pipe.
--flat default:true
When true (the default) creates files at the top level of the project.
--lint-fix default:false
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the pipe.
--module
The declaring NgModule. Aliases: -m
--project
The name of the project.
--skip-import default:false
Do not import this pipe into the owning NgModule.
--skip-tests default:false
Do not create "spec.ts" test files for the new pipe.

Schematic commands: resolver

Generates a new, generic resolver definition in the given or default project.

Usage: 
  ng generate resolver <name> [options]
  ng g resolver <name> [options]

Arguments:
<name>
The name of the new resolver.
Options:
--flat default:true
When true (the default), creates the new files at the top level of the current project.
--project
The name of the project.
--skip-tests default:false
Do not create "spec.ts" test files for the new resolver.

Schematic commands: service

Creates a new, generic service definition in the given or default project.

Usage: 
  ng generate service <name> [options]
  ng g service <name> [options]

Arguments:
<name>
The name of the service.
Options:
--flat default:true
When true (the default), creates files at the top level of the project.
--lint-fix
Deprecated: Use "ng lint --fix" directly instead. Apply lint fixes after generating the service.
--project
The name of the project.
--skip-tests default:false
Do not create "spec.ts" test files for the new service.

Schematic commands: service-worker

Pass this schematic to the "run" command to create a service worker

Usage: 
  ng generate service-worker [options]
  ng g service-worker [options]

Options:
--configuration
Deprecated: No longer has an effect. The configuration to apply service worker to.
--project
The name of the project.
--target default:build
The target to apply service worker to.

Schematic commands: web-worker

Creates a new, generic web worker definition in the given or default project.

Usage: 
  ng generate web-worker <name> [options]
  ng g web-worker <name> [options]

Arguments:
<name>
The name of the worker.
Options:
--project
The name of the project.
--snippet default:true
Add a worker creation snippet in a sibling file of the same name.
--target default:build
Deprecated: No longer has an effect. The target to apply web worker to.