MaN8fy
MaN8fy

Reputation: 1565

"vite is not recognized ..." on "npm run dev"

I'm using Node.js and npm for the first time, I'm trying to get Vite working, following the tutorials and documentation. But every time I run into the problem:

'vite' is not recognized as an internal or external command, operable program or batch file.

I am unable to find a solution.

I tried restarting pc, reinstalling node.js and several procedures to create vite project but in vain.

Commands and responses I run when I try to create a vite project:
npm create vite@latest
>> my-portfolio >> vanilla & vanilla
cd my-portfolio
npm install >>resp: up to date, audited 1 package in 21s found 0 vulnerabilities npm run dev
resp:

> [email protected] dev
> vite

'vite' is not recognized as an internal or external command,
operable program or batch file.

Upvotes: 150

Views: 432300

Answers (29)

Michaël
Michaël

Reputation: 499

I had the same issue and found the cause and easy solutions.

Cause

The issue is simply that vite command's path is not known. And vite should stay in devDependencies.

Solutions

  1. Update your file package.json like this :

     "build": "./node_modules/.bin/vite build",
     "dev": "vite"
    
  2. Or create an alias.

This worked for me in all my environments : local and on my server.

Upvotes: 0

Michaël
Michaël

Reputation: 499

I had the same issue and found the cause and easy solutions.

Cause

The issue is simply that vite command's path is not known.

Solutions

  1. Update your file package.json like this :

     "build": "./node_modules/.bin/vite build",
     "dev": "vite"
    
  2. Or create an alias.

This worked for me in all my environments : local and on my server.

Upvotes: 0

Leonardo Rodrigues
Leonardo Rodrigues

Reputation: 11

Removing node_modules and package-lock.json, and running npm install did it for me. The state of the local files was out of sync after an outdated git pull

Upvotes: 0

hank
hank

Reputation: 53

Had the same issue:

Typed as instructed,

cd vite-project
npm install
npm run dev

On package.json, I had the following:

"vite": "^6.0.1"

but the message said

sh: vite: command not found

Installed the dependencies again by doing

npm install

and seems to work.

Upvotes: 2

Suleyman
Suleyman

Reputation: 252

When the NODE_ENV environment variable is set to production, npm will not install modules listed in devDependencies. And as vite is inside of it, it will not be installed and therefore not being recognized by npm.

Try this :

npm install --include dev

source: npm

Upvotes: 3

Mauro Soto
Mauro Soto

Reputation: 21

npm install npm run dev

And all should work; bare in mind that after running these commands and you still have issues, check on the package.json file if the scripts are being created properly.

Upvotes: 0

Elevator9253
Elevator9253

Reputation: 61

Solution

You may have issues with your project directory: try printing your working directory with pwd and see if there are any ambiguous characters (like a colon, which is the separator for $PATH elements). If there are any ambiguous characters, move or rename the faulty directories.

Explanation

On UNIX systems, the $PATH shell variable (which defines the locations of the binaries you can execute using just their name) is separated by colons (:): with an (unescaped) colon in a directory name, it will evaluate to two directories in the binary path, preventing you from running the local binary.

(This issue can also happen with ampersands: &)

Source: https://vitejs.dev/guide/troubleshooting#cli

Upvotes: 0

Marcus 123
Marcus 123

Reputation: 113

i had the same issue none of the other comments worked. it was because i had a slash "/" on a folder name in the path to the directory i was working on

Upvotes: 1

felix mutai
felix mutai

Reputation: 15

This worked out so well for me.

First install npm using **install npm** command in your terminal.

Then run your Node local server using **npm run dev** command.

After that, run your Node server to production by using the following command **npm run build**

Finally, run your PHP local server using the **php artisan serve**

Upvotes: 0

ericson
ericson

Reputation: 2219

Try to install the packages to make it work

npm install 

or

npm i

Upvotes: 221

Badr MOUMOUD
Badr MOUMOUD

Reputation: 345

with qwik i had this same issue, fixed by upgrading node from

nvm uninstall v16.0.0

to

nvm install v16.15.0

Upvotes: 0

Ahmed Elsharkawy
Ahmed Elsharkawy

Reputation: 21

I use Linux Ubuntu, and facing this problem, so when run npm install it install Vite but not global so i have to run npm install then run sudo npm install -g vite then run npm run dev and the problem solved with me.

Upvotes: 2

Arth
Arth

Reputation: 139

Install vite as a dev dependency first

npm i vite@latest -D

npm run dev

Upvotes: 10

Darshan Patel
Darshan Patel

Reputation: 171

I changed NODE_ENV environment variable to development ( earlier it was production - which should not be the case, as dev-dependencies won't get installed by npm install or yarn )

Before running npm install or yarn, make sure NODE_ENV environment variable is not set to production if you running locally for dev purpose.

Upvotes: 4

Marius Okouin
Marius Okouin

Reputation: 7

Using yarn:

  1. yarn add vite
  2. Then npm install

Upvotes: 0

Abhi Patel
Abhi Patel

Reputation: 131

Install Dependency Using Below Command.

npm install

or

yarn install

If you want to add vite manually use below commands

npm i vite

or

yarn add vite

on project folder run code using below commands.

npm run dev

or

yarn dev

Upvotes: 13

Ali Palvane
Ali Palvane

Reputation: 301

In addition to this answer suggesting npm i before npm run dev, make sure you don't have a proxy. Sometimes the problem is with your proxy.

Upvotes: 0

Mahek Gor
Mahek Gor

Reputation: 41

Check if vite is installed globally on your system. If not, you can try installing it globally by running npm install -g vite. This will make the vite command available throughout your system.

Upvotes: 4

Laloprince
Laloprince

Reputation: 59

Do the following:

  1. First npm install vite
  2. Then npm run dev

Upvotes: 1

Sarbkalyan Singh
Sarbkalyan Singh

Reputation: 1

I have Gone through this Error in last Couple of Hours. My Solution will be --

  1. Go to Package.json First
  2. Delete the Package which is making Error while running (if It's Running) .
  3. If it's not the Case Make Sure ur in Right( Correct ) Repo in which vite is able to Run.
  4. If Both Cases Don't Work then Tre to install the Dependency One by One which are Present and try to Run after it .
  5. Surely Changes will be Reflected in the Terminal .
  6. Remove changes or Install dep. Others again (which are left) and u r good to go . Note - Always Keep Look at the Terminal after Single Changes . That's how u debug Code adn Improve It

Upvotes: 0

Mbote-Joseph
Mbote-Joseph

Reputation: 73

I had the same challenge and I was finding the error

create-vite : command not found

I resolved by running the command:

npm i create-vite

From there you can continue with running the command:

npm create vite@latest

Reference:

https://www.npmjs.com/package/create-vite

Upvotes: 0

Nidhi
Nidhi

Reputation: 61

The following works just fine!

npx vite build
npm i
npm run dev

Upvotes: 3

Olamide Falowo
Olamide Falowo

Reputation: 21

try npm install

then npm run build

Upvotes: 2

Jason Goemaat
Jason Goemaat

Reputation: 29194

For me I had a project I created on one computer and it had this in devDependencies:

"vite": "^3.1.0"

I did pnpm install and it reported everything was fine, but I was getting the error. I ran pnpm install vite and it installed it again with this:

"vite": "^3.1.8"

After that it worked fine. So try using npm, yarn, or pnpm to install the vite package again and see if that works.

Upvotes: 5

chriscanna
chriscanna

Reputation: 196

According to documentation https://vitejs.dev/guide/#community-templates

npm install
npm run dev
npx vite build

Upvotes: 13

iRviNe48
iRviNe48

Reputation: 311

yarn add vite

on project folder to add vite, and run

npm run dev

again.

  • remember to update your node version to 18, LTS from 17 might not support this installation.

update:

I try to fresh install again my Laravel 9.19, since i had update my node to version 18, npm install & npm run dev just work fine without yarn.

Upvotes: 3

Ramiro
Ramiro

Reputation: 17

You need Node version 15 or higher, I had the same problem because I was using an older version of it.

Upvotes: 0

mihe
mihe

Reputation: 161

I found myself in the same situation.

The problem is vite.cmd is not in the system or user PATH variable, so it cannot be found when it is executed from your project folder.

To fix it, you should temporarily add the folder where vite.cmd is in your PATH variable (either for the entire system or your user). I recommend adding it just for your user, and keep in mind you should probably remove it after you stop working on that project, because this could affect future projects using the same build tools.

To do this:

  • My PC > Properties > Advanced system settings > Click on Environment Variables (alternatively just use the start button and begin typing Environment, you should get a direct link)
  • On "User variables" find "Path" and edit it.
  • Add a new entry for the folder where vite.cmd is. Example "C:\dev\reactplayground\firsttest\test01\node_modules.bin" Check your project folder to find the right path.
  • Make sure your close and open your console for this change to affect.
  • Go back to your project root folder and run "vite build", it should work now.

Upvotes: 0

Ronak Munjapara
Ronak Munjapara

Reputation: 689

For this error use the following command on your terminal in the present working directory of the project

npm install
npm run dev

first, try to install a node package manager and then run npm run dev hope it will work

Upvotes: 54

Related Questions