Overview of Angular CLI

Kailash Chandra Behera | Saturday, March 10, 2018

In this blog we discuss what is Angular CLI in Angular5 and will demonstrate how to install it.

Getting Started

The Angular CLI makes it easy to create an application, CLI in angular is a command-line interface tool for angular development. This angular tool is the official resource used to initialize, develop, scaffold, and maintain Angular projects directly from a command shell. It saves you from the mess of complicated configurations and builds resources like TypeScript, Webpack, and so on.

It also makes code really shine. Runs unit tests or end-to-end tests with the breeze of a command. Execute the official Angular liner and run clang-format.

Installation Angular CLI

To install Angular CLI, the node.js and npm are required. To install node.js click here, when you completes node.js installation the npm also gets installed. To verify the version of node.js and npm use below command lines and you will get the result like the below image.

Command Llines
 node -v  
 npm -v  

Use the below command line to install Angular CLI. It can be installed for a local or global level in a machine.

To add this package to your local machine, type the below command line into your command line.
 npm install @angular/cli  
To add this package to globally , type the below command line into your command line
 npm install -g @angular/cli  
You’ll notice a node_modules directory appear in your root like below images where the package is now installed.

After the process gets completed successfully , your are done with the Angular CLI installation and to verify use below command line.
 ng -v  
If there is no error while installing you will get result like below image.

If there is an error in installation then you will get below mentioned error. Because the path of NodeJs not updated in the environment variables with NodeJS installation due to some security issues, usually the nodejs Installation process updates the environment variales in a system.

npm is not recognized as an internal or external command.

In such cases you need to do it manually, the below steps guide how to add or update environment variable for npm.

  • Right click on the window icon of your system.
  • Then click on to the System.
  • The Settings window will be opened, on the right side panel find the Advanced system settings and click on it.
  • On the system properties window, click on the environment variables button.
  • You will get list of variables (User and System) on the in the Environment variables window, select the Path variable in user variable category and click on the edit button.
  • The Edit environment variable window will be appeared. Here you can enter the path of the folder where npm executable file is available.
  • you may get the folder in this path (C:\Users\[user_name]\AppData\Roaming\).
  • Open the npm folder, then copy the path of the folder from address bar. The folder path should be like below.
     C:\Users\[user_name]\AppData\Roaming\npm  
    
  • Sometimes, you will find the AppData folder hidden.
  • Follow the below steps to unhide the AppData, if you are in Windows 7
    1. Go to Windows Explorer.
    2. Open the C: drive.
    3. Click Organize on the menu bar.
    4. Select Folder and Search options.
    5. Select the View tab.
    6. Under Files and Folders > Hidden files and folders, select the option to Show hidden files, folders and drives.
    7. Click OK.
  • Follow the below steps to unhide the AppData, if you are in Windows 10
    1. Go to Explorer.
    2. Open the C: drive.
    3. Click View on the menu bar.
    4. Click the Options icon. (If you click the small arrow below it instead, choose Change Folder and Search options).
    5. Select the View tab.
    6. Under Files and Folders > Hidden files and folders, select the option to Show hidden files, folders and drives.
    7. Click OK.
  • Click on the New button, you will get mouse focuse in gird row. past the copied path.
  • then click OK->OK->OK
  • You are done with environment variable update. now check again the nodejs version in command prompt.
  • This time you will get the current version of nodejs, if you are still getting same message you need to talk with system administration

Thanks