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
(Optional)
_The following is angular's execution policy, see the official documentation:
Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned
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
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.
Open a folder on your code editor. i.e VSCode, Atom, Brackets e.t.c.
On the terminal navigate to the folder you want to install angular CLI on locally.
Run the following command.
npm install @angular/cli@V13.3.3
Notice the omitted -g and the version indication? here we are installing an angular CLI-specific version.
- In that same folder create your starter app.
ng new appName
**
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?
Top comments (6)
That was a nice read! Liked, bookmarked and followed, keep the good work!
Thank you.
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.
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
Thank you very much for this article, dude.
very informative content