49

I'm working with Angular2 in several projects. Each of this projects uses a different version of angular-cli, so, I need to be able to run and compile for production each separately with the correct version of angular-cli. When I installed angular-cli locally using save-dev, ng commands not found so I cannot create a build distribution for the project.

So the questions are: 1- How can I have multiple angular-cli versions in the same machine, without having them installed globally (with -g option)?, 2- Is it possible to run ng commands without having installed angular-cli globally?

1
  • Detailed working solution for existing angular projects given. here Commented Mar 20, 2024 at 17:34

7 Answers 7

71

You should always be able to run local for your current directory version of ANGULAR CLI by running:

node_modules/.bin/ng <ANY NG COMMAND>

instead of just

ng <ANY NG COMMAND>

just make sure, you are running this command from the root directory where your main package.json is located (and its node_modules directory)

There is an npm command returning node_modules/.bin path (which may be used for shorter writing):

// does not work on Windows   
`npm bin`/ng <ANY NG COMMAND>

Note that back ticks are used around npm bin and not single quote sign.

ng command is also added to package.json scripts section, so it is also possible to run local copy like this:

npm run ng -- <NG_OPTIONS>

note -- flag terminator, it must be inserted before ng options.

If you want to create a new ng project using particular version but without installing @angular/cli globally, you can use npx command:

npx @angular/cli@7 new <APP_NAME>

here npx will temporary install @angular/cli with latest (@7 at the time of answering :)) version and run its ng executable with passed parameters.

You even can do something completely useless (because local copy of @angular/cli was installed with ng new). Run ng serve with @6 version of CLI on @7 new project:

cd <APP_NAME>
npx @angular/cli@6 serve

UPDATE

Running these commands will use ng executable located locally within node_modules/.bin/, so you do not need to have it installed globally:

cd <APP_NAME>
npx ng serve
Sign up to request clarification or add additional context in comments.

4 Comments

thanks for response, i never do this like you say. Instead of, i figure it out how. In your current working project you are free to use the version of angular-cli you need, if you install angular-cli globally (- g option), when you create a build distribution (ng build --prod), it use the local version instead of the globally. In that way you always has the latest version installed on your computer and can run commands from ng without be inside on local bin folder. I will mark the question as finish Thanks for the response!!!
The comment above did not work for me - but the answer worked i.e node_modules/.bin/ng <ANY NG COMMAND>
Did this answer depend on certain things (say the cli), being installed as "dev" vs "global"? Which one(s)?
The question was about running ng commands on different angular cli projects, without installing angular cli globally. Actually, after creating a new angular cli app, it should be already installed and added to package.json as dev dependency (because it runs nam install). If for some reason you need to install angular cli for particular app, then run it as npm I @angular/cli -D
39

In case someone else came here like me with the same problem, I found this method as the easiest. I had @angular/[email protected] installed globally as I have an ongoing project created from that version(angular 5.0 roughly) but wanted to install @angular/[email protected]. What I did was installing npx and then created the project using npx

Install npx frpm npm

npm install -g npx

Create new project with the desired cli version. Use @angular/cli@latest or just @angular/cli for the latest version.

npx -p @angular/[email protected] ng new my-project

Inside the project root folder, execute ng --version to see the version of you cli. But I recommend you use npx prefix to every command that uses ng as follows.

npx ng --version

npx ng generate component my-component

Here the npx look for the ng command exists locally in ./node_modules/.bin/ directory and executes it.

1 Comment

Thank you so much. The only small difference is that using -v didn't work for me, I had to use --version.
14

You could use NVM which is a Node Version Manager and allows you to work with different global modules in each Node version.

In my case, I'm working with Node 6.9.5 and Angular2 in one project, and Node 10 and Angular6 in other.

You only have to pay attention which version is seated and work as normally as you do.

3 Comments

Can you provide the links how we can install two angular cli(s) using NVM. And also how to switch between node versions?
Sorry my late response, here you have github.com/creationix/nvm.
How does this relate to different versions of Angular? This is for different versions of Node, right?
6

create a Dockerfile

FROM node:8
WORKDIR /app
RUN npm install -g @angular/[email protected]

build this docker image

docker build . -t angular/ng6.1.1

run the docker image build in the last step

docker run --rm -it -v $(pwd):/app angular/ng6.1.1 ng new hello-angular

You will find hello-angular project was created in your local folder, and if you want to use different angular version, change the angular/cli version in docker file and build a new docker image to create a new angular project.

Comments

2

Assumptions:

a. You have one angular version installed and working on your machine. and now you want to install a different angular version.

b. You have installed the Angular CLI globally for the current angular project.

c. You are using Ubuntu/Linux.

Few Important comands:

$ node -v
$ npm -v
$ ng v
  1. Install NVM:

    i. Before installing nvm, run this in terminal: touch ~/.bash_profile

    Add following lines in  ~/.bashrc file
    
    sudo vim  ~/.bashrc
    
    source ~/.nvm/nvm.sh
    export NVM_DIR="$HOME/.nvm"
    

    ii. After, run this in terminal:

    curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash

    iii. Do not forget to Restart your terminal OR use the command $source ~/.nvm/nvm.sh (this will refresh the available commands in your system path).

    iv. In the terminal, use command $nvm --version and you should see the version

    v. Now install specific node Version

    e.g. new/angular-repo/path$ nvm install 13.11.0

    vi. To check list of node versions installed using:

    new/angular-repo/path$ nvm list

    vii. To use specific node for current project use:

    new/angular-repo/path$ nvm use v13.11.0

  2. Install specific Angular CLI

    new/angular-repo/path$ npm install @angular/[email protected]

  3. To install all dependencies run following command:

    new/angular-repo/path$ npm install

    After completion of the above command. make sure Node, Angular CLI, NPM, Angular have the intended version.

    new/angular-repo/path$ ng v

  4. If npm version is not showing as per your requirement in the above command, then install specific version using the following command

    new/angular-repo/path$ npm install npm@version

Hope it will be helpful.

Comments

0

Another solution is the following:

  1. Create a new folder and instantiate a node project with npm init.
  2. Install the Angular-CLI that related to the version that you need.
  3. Remove package.json file.
  4. Create/Import an Angular project that will have the version related to the CLI.

Further reading and explanation here

Comments

0

I think the best solutions is using npx.

Solution:

  1. Install npx, type on terminal: npm install -g npx
  2. Create a new angular project typing: npx -p @angular/cli@VERSION_YOU_WANT_TO_USE ng new PROJECT_NAME

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.