angular
/

Angular CLI – Command Line Mastery

Last Sync: Today

On this page

6
0%
5 min read
Remaining
5 minleft

Click any section to jump — progress syncs automatically

angular

Angular CLI – Command Line Mastery

What is the Angular CLI?

The Angular CLI (Command Line Interface) is a powerful tool used to initialize, develop, scaffold, and maintain Angular applications directly from a command shell. As an Engineering Manager or Lead, the CLI is your best friend for enforcing consistency across your team—ensuring that every component, service, and module follows the official style guide automatically.

  1. Essential Development Commands

These commands are the daily drivers for any Angular developer. They manage the lifecycle of the application from creation to local execution.

  • ng new <name>: Creates a new Angular workspace and an initial application.
  • ng serve: Builds the application and starts a local development server (usually at localhost:4200). It features 'Live Reload' to refresh the browser on save.
  • ng build: Compiles the application into an output directory (dist/) for deployment.
  • ng test: Runs unit tests using Karma and Jasmine.

  1. The 'Generate' Blueprint

Instead of creating files manually, the ng generate (or ng g) command uses schematics to create files with the correct boilerplate and registration logic. This is critical for maintaining a clean architecture.

BASHRead-only
1
# Generate a new component
ng generate component my-feature

# Generate a service for API calls
ng generate service core/api

# Generate a module with routing
ng generate module admin --routing

Angular CLI Lifecycle

The CLI handles the entire journey of a piece of code, from the moment you scaffold it to the moment it is optimized for production.

Common CLI Command Reference

CommandShort AliasDescription
ng generateng gCreates new files (components, pipes, etc.)
ng serve --openng s -oRuns app and opens in default browser
ng build --configuration productionng bBuilds optimized bundle for prod
ng lintng lRuns linting tools on your code base
ng addn/aInstalls a library and sets up configuration

  1. The Power of 'ng add'

The ng add command is a game-changer for architects. It doesn't just install a package; it runs a script to automatically configure your project to use that library. For example, adding Angular Material handles all the theme imports and module registrations for you.

BASHRead-only
1
ng add @angular/material

Test Your Knowledge

Q1
of 3

Which command is used to run unit tests in an Angular project?

A
ng run-tests
B
ng test
C
ng jasmine
D
ng verify
Q2
of 3

What is the short alias for the 'ng generate' command?

A
ng gen
B
ng create
C
ng g
D
ng +
Q3
of 3

Which command would you use to add a new library like Angular Material to your project?

A
npm install
B
ng add
C
ng generate
D
ng build

Frequently Asked Questions

What does the '--dry-run' flag do?

Adding '-d' or '--dry-run' to a generate command will show you exactly what files will be created and modified without actually making any changes. This is great for testing your folder structure first.

Can I customize the CLI blueprints?

Yes! For large-scale projects like Revochamp, you can create your own 'Schematics' to generate custom boilerplate that matches your specific architecture requirements.

What is 'ng update'?

It is the safest way to upgrade your Angular version and dependencies. It checks for updates and automatically applies 'code migrations' to keep your project current with the latest Angular APIs.

Previous

angular architecture

Next

angular project structure

Related Content

Need help?

Explore our comprehensive docs or start a chat with our tech experts.