Angular CLI Commands with Examples - RameshMF/Angular-8-Tutorial GitHub Wiki

The Angular CLI is a command-line interface tool that you use to initialize, develop, scaffold, and maintain Angular applications.

Installing Angular CLI

To install Angular CLI, run:

$ npm install -g @angular/cli

This will install the ng command globally on your system.

To verify whether your installation completed successfully, you can run this:

$ ng version

This displays the version you have installed:

@angular/cli: 1.0.0
node: 6.10.0
os: darwin x64

Angular CLI Commands

ng add

ng add - This Angular CLI command adds support for an external library to your project.

ng add <collection> [options]

Example: Below examples demonstrate the usage of ng add command:

  • ng add @angular/pwa — Turn your application into a PWA by adding an app manifest and service worker
  • ng add @ng-bootstrap/schematics — Add ng-bootstrap to your application
  • ng add @angular/material — Install and setup Angular Material and theming and register new starter components into ng generate
  • ng add @clr/angular — Install and setup Clarity from VMWare
  • ng add @angular/elements — Add the needed document-register-element.js polyfill and dependencies for Angular Elements

Read more about ng add the command at https://angular.io/cli/add

ng build

Compiles an Angular app into an output directory named dist/ at the given output path. Must be executed from within a workspace directory.

ng build <project> [options]
ng b <project> [options]

Example: ng add [options]

CLI command-language syntax

Command syntax is shown as follows:

ng commandNameOrAlias requiredArg [optionalArg] [options]
  • Most commands and some options have aliases. Aliases are shown in the syntax statement for each command.

  • Option names are prefixed with a double dash (--). Option aliases are prefixed with a single dash (-). Arguments are not prefixed. For example:

 ng build my-app -c production
  • Typically, the name of a generated artifact can be given as an argument to the command or specified with the --name option.

  • Argument and option names can be given in either camelCase or dash-case. --myOptionName is equivalent to --my-option-name.

Basic workflow

Invoke the tool on the command line through the ng executable. Online help is available on the command line. Enter the following to list commands or options for a given command (such as generate) with a short description.

diagram here

To create, build, and serve a new, basic Angular project on a development server, go to the parent directory of your new workspace using the following commands:

ng new my-first-project
cd my-first-project
ng serve
⚠️ **GitHub.com Fallback** ⚠️