Introduction:
Angular CLI (Command Line Interface) offers a suite of powerful commands to streamline Angular development tasks. In this tutorial, we’ll delve into various Angular CLI commands with detailed explanations and practical examples.
Table of Contents:
- Installation
- Generating Components
- Generating Services
- Generating Modules
- Running the Application
- Building for Production
- Testing
- Linting
- Configuration
- Additional Commands
1. Installation:
Before using Angular CLI commands, ensure you have Node.js and npm installed. Then, install Angular CLI globally via npm:
npm install -g @angular/cli
2. Generating Components:
Angular CLI simplifies component creation. Use the generate
command with component
or its shorthand c
to create components:
ng generate component my-component
This command creates a new component named my-component
with its template, styles, and TypeScript file.
3. Generating Services:
To generate services, use the generate
command with service
or its shorthand s
:
ng generate service my-service
This creates a service named my-service
with a TypeScript file where you can define business logic.
4. Generating Modules:
To generate Angular modules, use the generate
command with module
or its shorthand m
:
ng generate module my-module
This command creates a new module named my-module
with its own TypeScript file.
5. Running the Application:
Use the ng serve
command to run the Angular application locally:
ng serve
This starts a development server and serves the application on http://localhost:4200
by default.
6. Building for Production:
To build the application for production deployment, use the ng build
command:
ng build --prod
This command compiles the application and generates optimized bundles for production.
7. Testing:
Angular CLI offers testing capabilities. Use ng test
to run unit tests via Karma:
ng test
8. Linting:
To lint your code using TSLint, use the lint
command:
ng lint
This ensures your code adheres to best practices and style guidelines.
9. Configuration:
Angular CLI allows configuration via the angular.json
file. Modify settings like output paths, assets, and more to suit your project requirements.
10. Additional Commands:
Explore more Angular CLI commands by running ng help
or visit the official Angular CLI documentation.
Conclusion:
Mastering Angular CLI commands is crucial for efficient Angular development. With this guide, you’re equipped to leverage Angular CLI effectively, from project scaffolding to optimization and testing. Dive into your Angular projects with confidence using these powerful commands.