Angular 9 - Cli Cheatsheet

This post will take you to Learn Command line interface - CLI tutorials with examples, cheatsheet in angular9..

Angular 9 CLI

CLI is abbrevated as command line interface used to create angular resources and prototype or blueprint application.

This is very useful instant application, adding comments,services,templates,dirctives and pipes,helps reduce the time to run the applicaiton.

You can check more information here

Prerequisite

Once applications created, let’s see an examples of usage of angular cli commands

Angular cli cheatsheet

Following are usage of CLI with examples

Create a new component with cli command

ng generate component creates new components and update the component reference to application module.

ng generate component [componentname] or 
ng g component [componentname]
ng g c [componentname]

option gng This creates following files

  • Typescript component file
  • HTML template
  • CSS or SCSS styles files
  • Unit testing or end to end testing spec file
  • Lets see an example of creating a new component.
B:\github\angular9\myapp>ng g c FirstComponent
CREATE src/app/first-component/first-component.component.html (30 bytes)
CREATE src/app/first-component/first-component.component.spec.ts (685 bytes)
CREATE src/app/first-component/first-component.component.ts (310 bytes)
CREATE src/app/first-component/first-component.component.css (0 bytes)
UPDATE src/app/app.module.ts (430 bytes)

To create a component without testing file (–spec=false)

To create a child components, use the command inside a fold

ng generate component

Start Angular server

ng serve is the command to start the server, By default webserver is started with default port 4200.

ng serve

You can change the port number to different port

ng serve --port=91001
featureSyntaxDescription
create a new applicationng new appnameCreate a application with default folder structure with required components and install depdencies
Generate componentng generate component featureCreated new Component’s,template,- css/scss/typescript and unit testcases, router configurations
Generate componentng generate component featureCreated Component’s template,css/scss/typescript and unit testcases, router configurations
Building angular applicaitonng buildThis compiles, minification ,transpilation during build process