⚡️ Angular CLI Commands Cheat Sheet
๐ฆ Project Setup
Command | Description |
---|---|
ng new <project-name> | Create a new Angular project |
ng add <package> | Add a package and run schematics (e.g., @angular/material ) |
ng config | View or set config values in angular.json |
ng analytics | Enable or disable analytics |
๐ Serve & Build
Command | Description |
---|---|
ng serve | Serve the app locally with hot reload |
ng serve --port=4201 | Serve app on a custom port |
ng build | Build app for production |
ng build --configuration=development | Build in dev mode |
ng build --watch | Rebuild on file changes |
๐ Generate Code (Schematics)
Command | Description |
---|---|
ng generate component <name> or ng g c <name> | Generate a component |
ng g s <name> | Generate a service |
ng g m <name> | Generate a module |
ng g d <name> | Generate a directive |
ng g p <name> | Generate a pipe |
ng g i <name> | Generate an interface |
ng g guard <name> | Generate a route guard |
ng g class <name> | Generate a TypeScript class |
๐ Routing & Modules
Command | Description |
---|---|
ng g module <name> --routing | Generate a module with routing |
ng g component <name> --module=app | Register component in specific module |
ng g module <name> --standalone | Generate a standalone module/component (Angular 17+) |
๐งช Testing
Command | Description |
---|---|
ng test | Run unit tests with Karma |
ng test --watch=false | Run tests once and exit |
ng e2e | Run end-to-end tests (with Protractor or Cypress setup) |
๐ Linting, Format, & Analysis
Command | Description |
---|---|
ng lint | Run lint checks (ESLint if configured) |
ng lint --fix | Auto-fix lint errors |
ng doc <keyword> | Open Angular docs (e.g., ng doc directive ) |
๐ค Deployment & Misc
Command | Description |
---|---|
ng deploy | Deploy via configured builder (e.g., Firebase, Netlify) |
ng update | Update Angular CLI and core packages |
ng version | Show Angular versions |
ng help | List all CLI commands |
ng cache clean | Clear Angular build cache |
๐ก Tips
-
Use
--dry-run
on anyng g
command to preview changes. -
Use
--skip-tests
if you don’t want spec files generated. -
Combine flags like:
ng g c user/profile --standalone --flat
No comments:
Post a Comment