Angular CLI - The CLI tool for Angular.


Angular CLI logo

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

angular.dev/tools/cli

Contributing Guidelines · Submit an Issue · Blog

## Documentation Get started with Angular CLI, learn the fundamentals and explore advanced topics on our documentation website. - [Getting started][quickstart] - [CLI][cli] - [Workspace and project file structure][filestructure] - [Workspace configuration][workspaceconfig] - [Schematics][schematics] ## Development Setup ### Prerequisites - Install [Node.js] which includes [Node Package Manager][npm] ### Setting Up a Project Install the Angular CLI globally: ``` npm install -g @angular/cli ``` Create workspace: ``` ng new [PROJECT NAME] ``` Run the application: ``` cd [PROJECT NAME] ng serve ``` Angular is cross-platform, fast, scalable, has incredible tooling, and is loved by millions. ## Quickstart [Get started in 5 minutes][quickstart]. ## Ecosystem

angular ecosystem logos

- [Angular Framework][adev] - [Angular Material][angularmaterial] ## Changelog [Learn about the latest improvements][changelog]. ## Upgrading Check out our [upgrade guide](https://update.angular.dev/) to find out the best way to upgrade your project. ## Contributing ### Contributing Guidelines Read through our [contributing guidelines][contributing] to learn about our submission process, coding rules and more. ### Want to Help? Want to report a bug, contribute some code, or improve documentation? Excellent! Read up on our guidelines for [contributing][contributing] and then check out one of our issues labeled as [help wanted](https://github.com/angular/angular-cli/labels/help%20wanted) or [good first issue](https://github.com/angular/angular-cli/labels/good%20first%20issue). ### Code of Conduct Help us keep Angular open and inclusive. Please read and follow our [Code of Conduct][codeofconduct]. ### Developer Guide Read through our [developer guide][developer] to learn about how to build and test the Angular CLI locally. ## Community Join the conversation and help the community. - [X (formerly Twitter)][twitter] - [Discord][discord] - [Gitter][gitter] - [YouTube][youtube] - [StackOverflow][stackoverflow] - Find a Local [Meetup][meetup] ## Packages This is a monorepo which contains many tools and packages: ### Tools | Project | Package | Version | Links | |---|---|---|---| **Angular Build System** | [`@angular/build`](https://npmjs.com/package/@angular/build) | [![latest](https://img.shields.io/npm/v/%40angular%2Fbuild/latest.svg)](https://npmjs.com/package/@angular/build) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular/build/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-build-builds) **Angular CLI** | [`@angular/cli`](https://npmjs.com/package/@angular/cli) | [![latest](https://img.shields.io/npm/v/%40angular%2Fcli/latest.svg)](https://npmjs.com/package/@angular/cli) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular/cli/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/cli-builds) **Architect CLI** | [`@angular-devkit/architect-cli`](https://npmjs.com/package/@angular-devkit/architect-cli) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Farchitect-cli/latest.svg)](https://npmjs.com/package/@angular-devkit/architect-cli) | [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-architect-cli-builds) **Schematics CLI** | [`@angular-devkit/schematics-cli`](https://npmjs.com/package/@angular-devkit/schematics-cli) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Fschematics-cli/latest.svg)](https://npmjs.com/package/@angular-devkit/schematics-cli) | [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-schematics-cli-builds) ### Packages | Project | Package | Version | Links | |---|---|---|---| **Angular SSR** | [`@angular/ssr`](https://npmjs.com/package/@angular/ssr) | [![latest](https://img.shields.io/npm/v/%40angular%2Fssr/latest.svg)](https://npmjs.com/package/@angular/ssr) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular/ssr/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-ssr-builds) **Architect** | [`@angular-devkit/architect`](https://npmjs.com/package/@angular-devkit/architect) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Farchitect/latest.svg)](https://npmjs.com/package/@angular-devkit/architect) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular_devkit/architect/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-architect-builds) **Build Angular** | [`@angular-devkit/build-angular`](https://npmjs.com/package/@angular-devkit/build-angular) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Fbuild-angular/latest.svg)](https://npmjs.com/package/@angular-devkit/build-angular) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular_devkit/build_angular/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-build-angular-builds) **Build Webpack** | [`@angular-devkit/build-webpack`](https://npmjs.com/package/@angular-devkit/build-webpack) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Fbuild-webpack/latest.svg)](https://npmjs.com/package/@angular-devkit/build-webpack) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular_devkit/build_webpack/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-build-webpack-builds) **Core** | [`@angular-devkit/core`](https://npmjs.com/package/@angular-devkit/core) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Fcore/latest.svg)](https://npmjs.com/package/@angular-devkit/core) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular_devkit/core/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-core-builds) **Schematics** | [`@angular-devkit/schematics`](https://npmjs.com/package/@angular-devkit/schematics) | [![latest](https://img.shields.io/npm/v/%40angular-devkit%2Fschematics/latest.svg)](https://npmjs.com/package/@angular-devkit/schematics) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular_devkit/schematics/README.md) [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-devkit-schematics-builds) #### Misc | Project | Package | Version | Links | |---|---|---|---| **Angular Create** | [`@angular/create`](https://npmjs.com/package/@angular/create) | [![latest](https://img.shields.io/npm/v/%40angular%2Fcreate/latest.svg)](https://npmjs.com/package/@angular/create) | [![README](https://img.shields.io/badge/README--green.svg)](/packages/angular/create/README.md) **Webpack Angular Plugin** | [`@ngtools/webpack`](https://npmjs.com/package/@ngtools/webpack) | [![latest](https://img.shields.io/npm/v/%40ngtools%2Fwebpack/latest.svg)](https://npmjs.com/package/@ngtools/webpack) | [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/ngtools-webpack-builds) #### Schematics | Project | Package | Version | Links | |---|---|---|---| **Angular PWA Schematics** | [`@angular/pwa`](https://npmjs.com/package/@angular/pwa) | [![latest](https://img.shields.io/npm/v/%40angular%2Fpwa/latest.svg)](https://npmjs.com/package/@angular/pwa) | [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/angular-pwa-builds) **Angular Schematics** | [`@schematics/angular`](https://npmjs.com/package/@schematics/angular) | [![latest](https://img.shields.io/npm/v/%40schematics%2Fangular/latest.svg)](https://npmjs.com/package/@schematics/angular) | [![snapshot](https://img.shields.io/badge/snapshot--blue.svg)](https://github.com/angular/schematics-angular-builds) **Love Angular CLI? Give our repo a star :star: :arrow_up:.** [contributing]: CONTRIBUTING.md [developer]: docs/DEVELOPER.md [quickstart]: https://angular.dev/tutorials/learn-angular [changelog]: CHANGELOG.md [documentation]: https://angular.dev/overview [angularmaterial]: https://material.angular.io/ [cli]: https://angular.dev/tools/cli [adev]: https://angular.dev/ [workspaceconfig]: https://angular.dev/reference/configs/workspace-config [schematics]: https://angular.dev/tools/cli/schematics [filestructure]: https://angular.dev/reference/configs/file-structure [node.js]: https://nodejs.org/ [npm]: https://www.npmjs.com/get-npm [codeofconduct]: https://github.com/angular/angular/blob/main/CODE_OF_CONDUCT.md [twitter]: https://www.x.com/angular [discord]: https://discord.gg/angular [gitter]: https://gitter.im/angular/angular-cli [stackoverflow]: https://stackoverflow.com/questions/tagged/angular-cli [youtube]: https://youtube.com/angular [meetup]: https://www.meetup.com/find/?keywords=angular