Cheatsheet: Angular CLI Reference

See which version of the CLI you’re using:

ng --version

Updating the Version

Run this:

npm uninstall -g @angular/cli cache clean
npm install -g @angular/cli@latest

Get general help:

ng help

Or get help for a specific command:

ng help generate

Generate a new project:

ng new my-app

And here are a few flags you can use:

• --dry-run: See which files would be created, but don’t actually do anything.
• --verbose: Be more chatty.
• --skip-install: Don’t npm install, useful when offline or with slow internet.
• --skip-tests: Don’t create spec files.
• --skip-git: Don’t initialize a git repo.
• --source-dir: Name of the source directory
• --routing: Add routing to the app.
• --prefix: Specify the prefix to use for components selectors.
• --style: Defaults to css, but can be set to scss.
• --inline-style: Use inline styles for components instead of separate files.
• --inline-template: Use inline templates for components instead of separate files.

Here’s an example with a few flags:

ng new my-app --prefix yo --style scss --skip-tests --verbose

Generate a component:

ng g c unicorn-component

Generate a service:

ng g s everything-service

Generate a pipe:

ng g pipe my-pipe

Generate a directive:

ng g directive my-directive

Generate an enum:

ng g enum some-enum

Generate a module:

ng g module fancy-module

Generate a class:

ng g cl my-class

Generate an interface:

ng g interface my-interface

Generate a route guard:

ng g guard my-guard

The --dry-run and --verbose flags can be used with any generate command.

Serve your project

ng s

Serve and open in your default browser automatically:

ng s -o

Serve to a different port:

ng s --port 5555

ng test

And some flags you can use with the test command:

• --watch: Retest when some files change.
• --code-coverage: Add a coverage report.
• --progress: Show the progress while running the tests.
• --browsers: Specify which browsers to use.
• --colors: Use colors in the output or not.

Run the linter:

ng lint

A few flags for the linter:

• --fix: Apply fixes for linting errors.
• --force: Force success even when linting fails.

Build your app with the build command:

ng build

And here are some flags that you can use with build:

• --target: Specify the target for the build (e.g.: --target production).
• --aot: Use ahead of time compilation.
• --base-href: Specify the base href to use.
• --deploy-url: Specify the deployment url.
• --extract-css: Put the global styles in a CSS file instead of keeping it in the JavaScript.
• --watch: Rebuild every time a file changes.

The Angular CLI doesn’t do it for your project anymore? Just eject, and you’ll have the full Webpack config available to tweak to your heart’s desire:

ng eject

These are some of the most common commands for the Angular CLI. For a brief introduction to the Angular CLI, you can explore this tutorial.