Table of Contents
Many moving parts are involved in any Angular project, and the Angular CLI (Command Line Interface) is a new tool that makes it easy to get projects started, generate components, routes or services, serve your projects and to run tests.
This post covers Angular 2 and up.
Installing the Angular CLI
The first step is to install it from npm:
$ npm install -g @angular/cli
This will install the Angular CLI globally. If npm complains, then try running the command with <^>sudo<^>:
$ sudo npm install -g @angular/cli
Starting a new project
First use your terminal to navigate to a directory that will be the parent directory of your project, then run this command:
$ ng new app-name
This will create an Angular project with everything in place for your to get started coding right away! Here's an example of how the directory structure of your new project will look like:
├── README.md
├── angular-cli.json
├── **e2e …**
├── karma.conf.js
├── **node\_modules …**
├── package.json
├── protractor.conf.js
├── **src …**
└── tslint.json
Serving your project
This will run a local server at <^>http://localhost:4200<^> by default. It will also watch for changes in your project and refresh the page automatically. Run this command from within the project directory:
$ ng serve
ng generate
Use <^>ng generate<^> to generate useful things for your project like <^>components<^>, <^>routes<^>, <^>pipes<^>, <^>services<^> and <^>directives<^>. For example, here's how you would generate a component:
$ ng generate component path/component-name
Running tests
Finally, run your tests with <^>ng test<^>:
$ ng test