ng generate

Last update on August 19 2022 21:50:46 (UTC/GMT +8 hours)

Generates and/or modifies files based on a schematic

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

Description

Takes the name of the project, as specified in the projects section of the angular.json workspace configuration file. When a project name is not supplied, it will execute for all projects.

Arguments

ARGUMENT	DESCRIPTION
<schematic>	The schematic or collection:schematic to generate. This option can take one of the following sub-commands: appShell application class component directive enum guard interface library module pipe service serviceWorker universal webWorker

ARGUMENT

DESCRIPTION

<schematic>

The schematic or collection:schematic to generate. This option can take one of the following sub-commands:

appShell
application
class
component
directive
enum
guard
interface
library
module
pipe
service
serviceWorker
universal
webWorker

Options

OPTION	DESCRIPTION
--defaults=true\|false	When true, disables interactive input prompts for options with a default.
--dryRun=true\|false	When true, runs through and reports activity without writing out results. Default: false Aliases: -d
--force=true\|false	When true, forces overwriting of existing files. Default: false Aliases: -f
--help=true\|false\|json\|JSON	Shows a help message for this command in the console. Default: false
--interactive=true\|false	When false, disables interactive input prompts.

Schematic commands

appShell

ng generate appShell [options]
ng g appShell [options]

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

Options

OPTION	DESCRIPTION
--appDir=appDir	The name of the application directory. Default: app
--appId=appId	The app ID to use in withServerTransition(). Default: serverApp
--clientProject=clientProject	The name of the related client app.
--index=index	The name of the index file Default: index.html
--main=main	The name of the main entry-point file. Default: main.server.ts
--name=name	The HTML selector of the Universal app
--outDir=outDir	The output directory for build results. Default: dist-server

application

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

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

Arguments

ARGUMENT	DESCRIPTION
<name>	The name of the new app.

Options

OPTION	DESCRIPTION
--enableIvy=true\|false	EXPERIMENTAL True to create a new app that uses the Ivy rendering engine. Default: false
--inlineStyle=true\|false	When true, includes 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. Default: false Aliases: -s
--inlineTemplate=true\|false	When true, includes 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. Default: false Aliases: -t
--lintFix=true\|false	When true, applies lint fixes after generating the application. Default: false
--minimal=true\|false	When true, creates a bare-bones project without any testing frameworks. (Use for learning purposes only.) Default: false
--prefix=prefix	A prefix to apply to generated selectors. Default: app Aliases: -p
--routing=true\|false	When true, creates a routing NgModule. Default: false
--skipInstall=true\|false	Skip installing dependency packages. Default: false
--skipPackageJson=true\|false	When true, does not add dependencies to the "package.json" file. Default: false
--skipTests=true\|false	When true, does not create "spec.ts" test files for the app. Default: false Aliases: -S
--style=css\|scss\|sass\|less\|styl	The file extension or preprocessor to use for style files. Default: css
--viewEncapsulation= Emulated\|Native\|None\|ShadowDom	The view encapsulation strategy to use in the new app.

class

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

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

Arguments

ARGUMENT	DESCRIPTION
<name>	The name of the new class.

Options

OPTION	DESCRIPTION
--lintFix=true\|false	When true, applies lint fixes after generating the class. Default: false
--project=project	The name of the project.
--skipTests=true\|false	When true, does not create "spec.ts" test files for the new class. Default: false
--type=type	Adds a developer-defined type to the filename, in the format "name.type.ts". Default:

component

ng generate component <name> [options]
ng g component <name> [options]

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

Arguments

ARGUMENT	DESCRIPTION
<name>	The name of the component.

Options

OPTION	DESCRIPTION
--changeDetection=Default\|OnPush	The change detection strategy to use in the new component. Default: Default Aliases: -c
--entryComponent=true\|false	When true, the new component is the entry component of the declaring NgModule. Default: false
--export=true\|false	When true, the declaring NgModule exports this component. Default: false
--flat=true\|false	When true, creates the new files at the top level of the current project. Default: false
--inlineStyle=true\|false	When true, includes 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. Default: false Aliases:?-s
--inlineTemplate=true\|false	When true, includes template inline in the component.ts file. By default, an external template file is created and referenced in the component.ts file. Default: false Aliases: -t
--lintFix=true\|false	When true, applies lint fixes after generating the component. Default: false
--module=module	The declaring NgModule. Aliases: -m
--prefix=prefix	The prefix to apply to the generated component selector. Aliases: -p
--project=project	The name of the project.
--selector=selector	The HTML selector to use for this component.
--skipImport=true\|false	When true, does not import this component into the owning NgModule. Default: false
--skipTests=true\|false	When true, does not create "spec.ts" test files for the new component. Default: false
--spec=true\|false	Deprecated: Use "skipTests" instead. When true (the default), generates a "spec.ts" test file for the new component. Default: true
--style=css\|scss\|sass\|less\|styl	The file extension or preprocessor to use for style files. Default: css
--styleext=styleext	Deprecated: Use "style" instead. The file extension to use for style files. Default: css
--viewEncapsulation= Emulated\|Native\|None\|ShadowDom	The view encapsulation strategy to use in the new component. Aliases: -v

Previous: ng test
Next: ng update