You can use the ng generate or ng g command to generate Angular building blocks (components, services, pipes, etc.).

You can find all possible blueprints in the table below:

Scaffold	Usage	Shortened
Component	ng generate component component-name	ng g c component-name
Directive	ng generate directive directive-name	ng g d directive-name
Pipe	ng generate pipe pipe-name	ng g p pipe-name
Service	ng generate service service-name	ng g s service-name
Class	ng generate class class-name	ng g cl class-name
Guard	ng generate guard guard-name	ng g g guard-name
Interface	ng generate interface interface-name	ng g i interface-name
Enum	ng generate enum enum-name	ng g e enum-name
Module	ng generate module module-name	ng g m module-name

So, for example, if you run ng generate component user-list - angular-cli will:

• create user-list directory in src/app folder or folder where you have run the command.
• inside that directory generate 4 files (user-list.component.ts, user-list.component.html, user-list.component.css and user-list.component.spec.ts)
• add user-list as a declaration in the @NgModule decorator of the nearest module.

To add a component with a selector [prefix]-user-list, run:

  $ ng g c user-list
  
  installing component
    create src/app/user-list/user-list.component.css
    create src/app/user-list/user-list.component.html
    create src/app/user-list/user-list.component.spec.ts
    create src/app/user-list/user-list.component.ts
    update src/app/app.module.ts

prefix prevents element name collisions with components in other apps and with native HTML elements. So, for example, if prefix is app - generated component will have app-user-list selector.

• To prevent prefix usage add --prefix false or -p false flag

  $ ng g c user-list --prefix false

import { Component } from '@angular/core';

@Component({
  selector: 'user-list',
  templateUrl: './user-list.component.html',
  styleUrls: ['./user-list.component.css']
})
export class UserListComponent {}

• To prevent .spec files creation add --spec false or -sp false flag

  $ ng g c user-list --spec false

  installing component
    create src/app/user-list/user-list.component.css
    create src/app/user-list/user-list.component.html
    create src/app/user-list/user-list.component.ts
    update src/app/app.module.ts

• To use inline html templates instead of external templates add --inline-template or -it flag

  $ ng g c user-list --inline-template

  installing component
    create src/app/user-list/user-list.component.css
    create src/app/user-list/user-list.component.spec.ts
    create src/app/user-list/user-list.component.ts
    update src/app/app.module.ts

• To use inline styles instead of external styles add --inline-style or -is flag

  $ ng g c user-list --inline-style

  installing component
    create src/app/user-list/user-list.component.html
    create src/app/user-list/user-list.component.spec.ts
    create src/app/user-list/user-list.component.ts
    update src/app/app.module.ts

• To prevent folder creation add --flat or -f flag

  $ ng g c user-list --flat
  
  installing component
    create src/app/user-list.component.css
    create src/app/user-list.component.html
    create src/app/user-list.component.spec.ts
    create src/app/user-list.component.ts
    update src/app/app.module.ts

You can also combine flags listed above. For example, to create only .component.ts file without .css, .html, .spec files and folder use the following command.

  $ ng g c user-list -f -it -is -sp false
  
  installing component
    create src/app/user-list.component.ts
    update src/app/app.module.ts  

All generate component flags:

Description	Flag	Shortened	Default Value
Prevent folder creation	--flat	-f	false
Prevent prefix usage	--prefix false	-p false	true
Prevent .spec files creation	--spec false	-sp false	true
Enable inline html templates	--inline-template	-it	false
Enable inline styles	--inline-style	-is	false

To add a directive with a selector [prefix]Highlight, run:

  $ ng g d highlight

  installing directive
    create src/app/highlight.directive.spec.ts
    create src/app/highlight.directive.ts
    update src/app/app.module.ts

• To prevent prefix usage add --prefix false or -p false flag

  $ ng g d highlight --prefix false

import { Directive } from '@angular/core';

@Directive({
  selector: '[highlight]'
})
export class HighlightDirective {}

• To prevent .spec files creation add --spec false or -sp false flag

  $ ng g d highlight --spec false

  installing directive
    create src/app/highlight.directive.ts
    update src/app/app.module.ts

• To enable folder creation add --flat false or -f false flag

  $ ng g d highlight --flat false
  
  installing directive
    create src/app/highlight/highlight.directive.spec.ts
    create src/app/highlight/highlight.directive.ts
    update src/app/app.module.ts

You can also combine flags listed above. For example, to create only highlight.directive.ts file inside highlight folder without .spec file use the following command.

  $ ng g d highlight -f false -sp false

  installing directive
    create src/app/highlight/highlight.directive.ts
    update src/app/app.module.ts

All generate directive flags:

Description	Flag	Shortened	Default Value
Enable folder creation	--flat false	-f false	true
Prevent prefix usage	--prefix false	-p false	true
Prevent .spec files creation	--spec false	-sp false	true

To add a service with a name UserService, run:

  $ ng g s user

  installing service
    create src/app/user.service.spec.ts
    create src/app/user.service.ts

• To prevent .spec files creation add --spec false or -sp false flag

  $ ng g s user --spec false
  
  installing service
    create src/app/user.service.ts

• To enable folder creation add --flat false or -f false flag

  $ ng g s user --flat false

  installing service
    create src/app/user/user.service.spec.ts
    create src/app/user/user.service.ts

You can also combine flags listed above. For example, to create only user.service.ts file inside user folder without .spec file use the following command.

  $ ng g s user -f false -sp false

  installing service
    create src/app/user/user.service.ts

All generate service flags:

Description	Flag	Shortened	Default Value
Enable folder creation	--flat false	-f false	true
Prevent .spec files creation	--spec false	-sp false	true

To add a pipe with a name searchByName, run:

  $ ng g p search-by-name

  installing pipe
    create src/app/search-by-name.pipe.spec.ts
    create src/app/search-by-name.pipe.ts
    update src/app/app.module.ts

• To prevent .spec files creation add --spec false or -sp false flag

  $ ng g p search-by-name --spec false
  
  installing pipe
    create src/app/search-by-name.pipe.ts
    update src/app/app.module.ts

• To enable folder creation add --flat false or -f false flag

  $ ng g p search-by-name --flat false
  
  installing pipe
    create src/app/search-by-name/search-by-name.pipe.spec.ts
    create src/app/search-by-name/search-by-name.pipe.ts
    update src/app/app.module.ts

You can also combine flags listed above. For example, to create only search-by-name.pipe.ts file inside folder search-by-name folder without .spec file use the following command.

  $ ng g p search-by-name -f false -sp false

  installing pipe
    create src/app/search-by-name/search-by-name.pipe.ts
    update src/app/app.module.ts

All generate pipe flags:

Description	Flag	Shortened	Default Value
Enable folder creation	--flat false	-f false	true
Prevent .spec files creation	--spec false	-sp false	true

To add a module called GuestModule, run:

  $ ng g m guest

  installing module
    create src/app/guest/guest.module.ts

• To enable .spec files creation add --spec or -sp flag

  $ ng g m guest --spec

  installing module
    create src/app/guest/guest.module.spec.ts
    create src/app/guest/guest.module.ts

• To enable routing add --routing or -r flag

  $ ng g m guest --routing

  installing module
    create src/app/guest/guest-routing.module.ts
    create src/app/guest/guest.module.ts

You can also combine flags listed above. For example, to create module with routing and specs use the following command.

  $ ng g m guest -sp -r
  
  installing module
    create src/app/guest/guest-routing.module.ts
    create src/app/guest/guest.module.spec.ts
    create src/app/guest/guest.module.ts

All generate module flags:

Description	Flag	Shortened	Default Value
Enable .spec files creation	--spec	-sp	false
Enable routing	--routing	-r	false