Angular 12 - Cli Cheatsheet

Angular 12 CLI

CLI is abbreviated as a command-line interface used to create angular resources and prototype or blueprint applications.

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

You can check more information here

Prerequisite

• First step is to do angular-clic installation
• Create a application using angular-cli, check this article

Once applications are created, let’s see an example of the usage of angular CLI commands.

Angular cli cheat sheet

Following is the usage of CLI with examples

Create a new component with the CLI command

ng generate component creates new components and updates the component refers to the application module.

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

option This creates the following files

• Typescript component file

• HTML template

• CSS or SCSS styles files

• Unit testing or end-to-end testing spec file

Let’s 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 component, use the command inside a fold

ng generate component

Start Angular server

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

ng serve

You can change the port number to a different port

ng serve --port=91001