Installing Angular CLI Locally & Globally
Wisdom John ikoi

Wisdom John ikoi @xenxei46

About: Wisdom is a Front-end developer and technical writer he loves problem solving and creating beautiful, responsive and dynamic web applications. He loves to shares knowledge through writing.

Location:
Nigeria
Joined:
May 20, 2022

Installing Angular CLI Locally & Globally

Publish Date: Sep 15 '22
65 11

Angular is a JavaScript Framework and it is one of the world most powerful web development platform.

Starting an angular project will require an IDE and a development environment. Setting up a project can be done in two ways either by setting up on the cloud or by setting up a local environment and workspace.

While working directly in a cloud-based environment is an awesome experience, setting up your coding project in a local environment is mostly preferred especially on a large project and code base.

This article explains how to set up your Angular development environment locally or globally using the Angular CLI tool.

Globally

To install angular CLI globally Run the following command on your VSCode Terminal or Command Prompt.

npm install -g @angular/cli

Enter fullscreen mode Exit fullscreen mode

(Optional)

_The following is angular's execution policy, see the official documentation:

https://docs.microsoft.com/en-us/powershell/module/microsoft.powershell.core/about/about_execution_policies_

Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned
Enter fullscreen mode Exit fullscreen mode

You have successfully installed the angular CLI globally with the latest version of angular.

You can now create an angular application in any directory it will listen for the global CLI.

To create a new workspace navigate to a specific folder in your terminal and run:

ng new appName
Enter fullscreen mode Exit fullscreen mode

A starter app is created, select which feature should be installed alongside your initial app and press enter.

now your app is created, and depends on the angular CLI version that was installed globally.

Locally

While creating subsequent angular applications (ng apps) you might want a lesser version and you may not want to re-install your global CLI because it will affect other apps that depend on it.

This is where local CLI installation comes in. The local CLI serves as a dependency to an ng-app or a set of ng-apps ignoring the Global CLI.

which means the Global CLI can be angular V14 and the local CLI supports angular V13 making all apps that depend on it respond to that angular version.

The local CLI serves as a guard and restricts apps from listening to the global CLI.

To set up an angular application locally do the following.

  1. Open a folder on your code editor. i.e VSCode, Atom, Brackets e.t.c.

  2. On the terminal navigate to the folder you want to install angular CLI on locally.

  3. Run the following command.

npm install @angular/cli@V13.3.3
Enter fullscreen mode Exit fullscreen mode

Notice the omitted -g and the version indication? here we are installing an angular CLI-specific version.

  1. In that same folder create your starter app.
ng new appName
Enter fullscreen mode Exit fullscreen mode

**
Conclusion**

Any Application you generate within that folder/directory is restricted to the Angular locally installed CLI version.

While the ones created outside the folder automatically listen for the global CLI and subscribe to it as its dependency.

Installing Angular CLI locally or globally has its own effect on the development process, you can choose to subscribe to the global CLI or create a local CLI for your individual angular application to depend on.

Extra

I prefer to localize my angular projects and give them standalone CLI as I see fit, what do you prefer?

Comments 11 total

  • Al - Naucode
    Al - NaucodeSep 15, 2022

    That was a nice read! Liked, bookmarked and followed, keep the good work!

  • Manojkumar
    ManojkumarMar 13, 2024

    very informative content

  • Alexey Ryzhkov
    Alexey RyzhkovJul 22, 2024

    Hi, thanks for sharing the approach. Running some projects on the same windows machine I've faced to use different nodejs and angular cli versions simultaneously. I follow your way and have an issue with running ng when angular cli installed locally. I didn't install angular cli globally. I'm not sure do I need to have global angular cli if I need local versions? I will continue to try run it but it will be very kindly to hear your recommendations :) Thanks in advance.

    • Alexey Ryzhkov
      Alexey RyzhkovJul 23, 2024

      BTW. Hope it will help someone like me. For sure ng and ng.cmd are in the local node_modules. Maybe I can run it locally with direct path to them. But I just install globally lower version of angular/cli. Thus I can run "ng new ". And it works well.
      Meanwhile I did steps after failure to run ng with local angular/cli:
      State: No global anguar/cli. Local angular/cli is 18.1.1

      1. npm install -g @angular/cli@18.0 // especially to separate and test how it will work
      2. test ng and it works now but shows version 18.0
      3. install new app: ng new cli181
      4. move to cli181
      5. ng version // 18.1.1 as it is desired
      6. run ng serve --open --watch // it works as expected
    • Wisdom John ikoi
      Wisdom John ikoiMar 4, 2025

      hey man, i haven't been active in so long but if this answer is still valid, uninstall the cli, try a global cli install first with the latest angular version then run a local installation.

  • Ashok Kumar
    Ashok KumarNov 28, 2024

    Thank you very much for this article, dude.

Add comment