Angular 4 cli and Its Usages


Posted On: Feb 10, 2023

Angular 4 cli and Its Usages


Angular has grown into an excellent framework over time which is used for the very purpose of developing applications across platforms. With the limited phase of the framework heading to the unlimited phase, you can expect many major features being added to this framework.

Today we will talk about the CLI – Command Line Interface of this framework, its uses to developers in exploiting the resources to the maximum to obtain optimum efficiency in terms of speed and productivity. The main purpose of Angular CLI is to create an application which works with ease.

Angular CLI provides you an option to generate components, routes, services and pipes with a simple command. Numerous things can be achieved with the CLI alone. Some of the noticeable ones are:

  • Create a new Angular application
  • Real-time server maintenance and support
  • Add features to your existing application
  • Run tests on your application units
  • Application building for production

Angular CLI Install and create an application

You can Install Angular CLI by running below command on your terminal. Make sure Node js and NPM latest version is installed.

npm install -g @angular/cli

Installing Angular js

Installing Angular is very easy with the ng command. Once you know that the Angular has been installed, you could create a new application in 2 ways:

  • ng init: create a new application in the current directory
  • ng new: create an application in a new directory.

With either of these 2 steps, your application will be created in the specified directory. You could start running the application once you have added all the necessary features to it.

However, do ensure that you have these 3 things configured or framework will automatically get configured to default values if you don't.

  1. angular.cli.json is the configuration file, CLI loads from it
  2. Packages are run to build JavaScript and CSS code
  3. Package device server will run to provide results to you

Using the Generate package for Angular, you could add class, component, directives, modules, pipes and new service to your application.

Read Five JavaScript Frameworks to learn in 2018

Running Tests in Angular js

A test runner will automatically start once you create an application. Using the same ng command, you could specify the CLI to create a corresponding file with a sample test for the features added.

These files are created in the same directory of the application. All units can be tested at once using the same ng command with all the files in the source directory.

Angular: an application built for production

The command ng server builds and bundles the newly created application to the virtual file system when in the development stage. You need read files which are meant to be deployed to the server or cloud for production.

Once you start with the command ng build, you have these options at your disposal:

  • Aot-ahead of time
  • Base-href-base href to be used in the index file
  • Environment-device, environment to use
  • Output-path-directory to write the output to
  • Target development, environment to use
  • Watch-keep an eye out for changes to rebuild files

Some of the features that you could expect to work within the near future for this Angular CLI would be application support, extensibility, enhanced performance and library developer mode.


The growth in Angular has been exponential; you need to upgrade yourself with the latest trends in the market to provide that out-of-the-box service to your clients.

Also, Read Best Node JS Interview Questions

    Please Login or Register to leave a response.

    Related Articles

    Angularjs Tutorials

    Angular 5 Modal dialog example

    Read how to add delete confirm box in Angular 4, Angular 5, Angular 6 modal dialog popup. In this article, we are going to see how to add a delete confirmation box in Angular Js we are using ngx-moda..

    Angularjs Tutorials

    Why Angular JS is one of the popular JavaScript frameworks

    Why Angular JS is one of the popular JavaScript frameworks. In this article read about the key features of Angular Framework. In the era of the online shopping, every fact wants to create their presen..

    Angularjs Tutorials

    Top 10 AngularJS Interview Questions for Experience

    In case you're searching for top 10 AngularJS Interview Questions online, look no further and dive straight into the basics that usually the panelists ask during an interview.Many corporates and M..