64

While installing the dependencies of vue-cli, vue is not identified. Why?

error message while creating a project

3

24 Answers 24

34

rm -rf node_modules and npm install again have a look here

1
  • thanks, this should be the right answer! Mar 15, 2022 at 17:09
28

I had the same issue for a while.

TL;DR

 npm install @vue/cli-service --save-dev

As the documentation specify it is a development dependency https://cli.vuejs.org/guide/#cli-service

The CLI Service (@vue/cli-service) is a development dependency. It's an npm package installed locally into every project created by @vue/cli.

Origin

I had a fresh install of nodejs And just did

>> sudo npm install -g @vue/cli@latest

>> vue --version
@vue/cli 4.5.8

The issue

The issue presented like this

>> npm run serve
yarn run v1.22.10
$ vue-cli-service build --mode development --watch
/bin/sh: 1: vue-cli-service: not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

The fixes:

npm install @vue/cli-service --save-dev

Which led me straight to another error message

>> npm run serve
yarn run v1.22.10
$ vue-cli-service build --mode development --watch
ERROR  Error: Cannot find module 'vue-template-compiler/package.json'

Which I fixed the same way

npm i vue-template-compiler --save-dev

And now it is working fine.

26

Add sudo before yarn when installing

  • yarn global remove @vue/cli
  • sudo yarn global add @vue/cli
  • vue
5
  • 76
    I can't believe this answer has 38 votes. Never use sudo with yarn or npm. That's a bad idea. May 20, 2020 at 4:53
  • 3
    @NimeshkaSrimal I think they just were looking for "just work" solution. Sure they will face permission problems in the future. Jul 13, 2020 at 15:09
  • 1
    @NimeshkaSrimal can you explain why so that we can learn.
    – Bryan
    Jul 9, 2021 at 22:01
  • 4
    @Bryan: It's fairly simple: npm pulls in easily hundreds if not thousands of modules. If you install these granting root permissions you can easily install a malicious script without noticing. Using sudo may seem like an easy way out - and it is - if you don't care about security at all. Unfortunately (and surprisingly), many developers don't care much about that (as we can see from this thread where using sudo is suggested in at least half of comments!). If my mother doesn't care I wouldn't mind but people reading this thread are developers. They SHOULD know better!
    – grmmgrmm
    Oct 19, 2021 at 16:58
  • 1
20

Installing current version without permanently installing vue-cli.

npx @vue/cli create appname 
10

It shows the vue executable is located at /home/alisha/.local/bin. So probably this location is not there in your $PATH.

You should be able to run the vue commands if you provide the full path, like:

~/.local/bin/vue create hello-world

You can also see if that directory is in your PATH by running some command like:

echo $PATH | grep '.local/bin/'

If it's there, you would see it, otherwise you can add it to your path by placing it in your ~/.profile.

Edit ~/.profile and add the following at the bottom of it.

PATH="$HOME/.local/bin:$PATH"

Hope it helps!!

3
  • Their guidelines were good, for me only changed the locally: ~/.npm-global/bin/ Apr 10, 2019 at 14:46
  • after editing .profile run source ~/.profile to changes take effect on the current terminal
    – Arash
    May 8, 2021 at 19:53
  • This is the only answer that actually helped me, thank you.
    – Someone
    May 6, 2022 at 12:33
6

I had the same issue while making a build for production.

You will require vue-cli to be installed. Use below command to install the latest version.

npm install -g @vue/cli@latest

Then

npm install
1
  • 3
    DON'T use sudo for installing anything with npm and DON'T encourage people to do so!
    – grmmgrmm
    Oct 19, 2021 at 16:47
3

Might have to do with you having an old version on your computer:

Warning regarding Previous Versions

The package name changed from vue-cli to @vue/cli. If you have the previous vue-cli (1.x or 2.x) package installed globally, you need to uninstall it first with npm uninstall vue-cli -g or yarn global remove vue-cli.

You can find it here: https://cli.vuejs.org/guide/installation.html

3

THIS FIXED THE ISSUE FOR ME:

After running

sudo npm install -g @vue/cli

I ran

sudo nano $HOME/.profile

and pasted the following line

export PATH=$PATH:/home/chike/.npm-global/bin

after writing the code, next thing I did was Ctrl + O, ENTER and Ctrl + X then wrote

vue init webpack myapp

3

When you install vue using cli that time you got the path of vue.Now you can copy the bin folder path.
In my example /home/sublime/.npm-packages/bin

Now you export the path below command

export PATH=$PATH:/home/sublime/.npm-packages/bin
3

I solved mine by running (add sudo if needed)

1
  • 1
    Same here as above: DON'T use sudo for installing anything with npm and DON'T encourage people to do so!
    – grmmgrmm
    Oct 19, 2021 at 16:47
3

Got similar issue when deploy vue project in jenkins.

Here is what I did:

Add node's bin/ dir, to jenkins user's .bashrc file.

e.g

# node
NODE_HOME=/home/dev/.nvm/versions/node/default
PATH=$NODE_HOME/bin:$PATH

Tips - about nvm & yarn

  • When you manage node version via nvm, make sure you already choose the node version in terminal. e.g:
    nvm use stable
    node -v
  • If you use nvm, and installed yarn via npm, then better install vue-cli via npm not yarn, otherwise the vue executable is not placed into node's bin/ dir, at least that's the case in my tests, and as a result will cause you fail to find the vue command.
2

Using Yarn on Ubuntu it is installed to ~/.npm-packages/bin/. You must add this directory to your PATH. For example run the following command, close your terminal and open a new one.

user@machine:~$ echo 'export PATH="$PATH:~/.npm-packages/bin/"' >> ~/.bashrc

Note: if the file ~/.bashrc does not exist then simply create it.

2
  • 1
    I found my binaries at ~/.yarn/bin/ (not at ~/.npm-packages/bin/), checked by running yarn global bin. Jul 13, 2020 at 14:57
  • And please note: Adding lines to .bashrc file will start to work on the next login. So, you have to re-login to make it work or by manually execute export PATH="$PATH:~/.yarn/bin/. Jul 13, 2020 at 15:06
2

Following worked for me:

First remove all the existing ones:

yarn global remove @vue/cli
yarn global remove @vue/cli-service
sudo yarn global remove @vue/cli
sudo yarn global remove @vue/cli-service

Then add @vue/cli using sudo:

Note: use sudo if required

yarn global add @vue/cli
yarn global add @vue/cli-service

Then, the final thing to do is to RESTART the terminal.

vue --version
@vue/cli 4.5.9
2

If you already got a project, the only two things you need to do is:

  1. Delete the directory node_modules (it is safe, since it is not under git and will regenerate in the next step)
  2. In the command-line write yarn install (it will install everything you need)

If you start installing vue-cli manually in a existing project, it the package.json and package-lock.json will be updated. If you already did. Do a checkout from git, and follow my steps above

2
  • yarn ist not known/found. Sep 26, 2022 at 10:07
  • Then you can achive the same using npm. Then the command is: npm install
    – Skywalker
    Sep 28, 2022 at 7:38
2

This may be a problem caused by version conflicts. "export PATH=$PATH:" This is really useful in some cases. But if you are also like me, after trying the direct “export path” method in the comment above, restarting the terminal still can not execute the situation, you can try this way.

  1. Uninstall Vue

    npm uninstall -g @vue/cli
    
  2. Check the local-global npm package installation path, vue is installed in this directory, check if it has been removed.

    npm root -g
    
  3. Install vue (you can check with https://cli.vuejs.org/#getting-started to find the latest command)

    npm install -g @vue/cli
    
  4. Create a connection to the /usr/local/bin directory(You need to find the vue.js path after the local installation first, then replace this path with your latest local install path:/Users/xxxxx/.npm-global/lib/node_modules/@vue/cli/bin/vue.js)

    ln -s /Users/xxxxx/.npm-global/lib/node_modules/@vue/cli/bin/vue.js /usr/local/bin/vue
    
  5. View version number

    vue -V
    
1
  • vue -V (note: capital V)
    – Ben Coffin
    Mar 10, 2023 at 18:09
1

I was getting the same error because Node.js was not installed. My issue got resolved by installing Node.js using the following command:

sudo apt install nodejs-legacy

To see if you already have Node.js and npm installed and check the installed version, run the following commands:

node -v
npm -v

If both are installed then follow the steps here: https://docs.npmjs.com/resolving-eacces-permissions-errors-when-installing-packages-globally

1

I installed the package using yarn global add @vue/cli on my Ubuntu box and found the binary in /home/vonkad/.yarn/bin.

I had to modify my /home/vonkad/.bashrc and add the directory to the path export PATH=$PATH:/home/vonkad/.yarn/bin.

1

To fix this situation, I had to add the following line to my .zshrc (maybe in your case is .bashrc)

export PATH="$(yarn global bin):$PATH"

Effectively, the yarn global bin is a folder where vue (vue-cli 3) was placed.

1
1

If npm install -g @vue/cli was not help, then run

npm i @vue/cli-service. It creates vue-cli-service in your ./node_modules/.bin.

0

What helped me

mac os catalina with zsh terminal

  1. Uninstalled node and npm using https://www.positronx.io/how-to-uninstall-node-js-and-npm-from-macos/
  2. Downloaded node/npm from https://nodejs.org/en/download/current/
  3. sudo npm install -g @vue/cli
  4. vue --version (@vue/cli 4.5.4)
0

I faced the same issue and now resolved. In my case I installed Node.js and NPM using the default Ubuntu repository by using this command sudo apt-get install nodejs npm

The problems seemed like those 2 packages are not well maintained so it caused some bugs.

So I purge those packages and reinstall it from nodesource which is officially recommended way to install (reference: Installation instruction from nodesource) using these commands.

curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -
sudo apt-get install -y nodejs

Then reinstall @vue/cli again

sudo npm install -g @vue/cli

Now these issues have gone. Hope it helps some programmers.

0

If you have WSL2 running and you use zsh like me, just add

yarn global add @vue/cli

# add this line to ~/.zshrc
export PATH="$HOME/.yarn/bin:$PATH"

$ vue --version
@vue/cli 4.x.xx
-1

You need to install vue via sudo like explained in the doc: https://cli.vuejs.org/guide/installation.html enter image description here

1
  • The screenshot/article you posted mentions nothing of sudo, that's just plain wrong.
    – kontur
    Jan 29 at 13:25
-4

You can try the following code install see

npm install --global vue-cli
vue init webpack <YOUR-PROJECT-NAME-HERE>
cd <YOUR-PROJECT-NAME-HERE>
npm install
npm run dev

1
  • 1
    This is proposing an install of an older version of the vue-cli, while the original post is about vue-cli 3 Jul 4, 2018 at 18:22

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.