Angular CLI

It is a tool for scaffolding a new Angular project. It is a tool that manages other tools, like Webpack, Babel, TypeScript, SASS, etc.

It includes:

Fully functional project generation THAT JUST WORKS!
Code generator for components, directives, pipes, enums, classes, modules and services
Build generation
Unit test runner
End-to-end test runner
App deployment to GitHub pages
Linting
CSS preprocessor support
AOT support
Lazy routes
Fully extensible schematics

What can the CLI do?

Build the project
Start a development server
Run tests
Deploy the app

Commands

Install CLI

npm install -g @angular/cli

ng version
ng help

New Project

ng new [project-name]

Start server

ng serve

Generate Component

ng generate component post 
ng g c post --inlineTemplate --inlineStyle

To make inlineTemplate and inlineStyle the default behvaior of the cli, add the following configuration into the angular.json file under projects -> projectName -> schematics.

"schematics": {
    "@schematics/angular:component": {
        "inlineStyle": true, 
        "inlineTemplate": true
    }
}

Generate Service

ng generate service my-service
ng g s my-service

Generate Interface

ng generate interface post
ng g i post

Errors and Solutions

Symbolic Links

If you are using Symbolic Links in your path, you’ll get main.ts and polyfill.ts missing errors.

To resolve this, edit angular.json file and add "preserveSymlinks": true at projects/{yourprojectname}/architect/build/options

Backlinks

Services