Basile404's avatar

Npm run dev => Vite error: module not found

Hi all!

I am having a bit of trouble debugging an error when I try to run Vite on my local project.

My Setup

I just installed a fresh laravel 11 app (breeze - blade - pest - no git - mysql) The installation was accidentally creating a nested folder so after it was done installing I simply moved everything from inside to the root folder manually.

The Issue

Starting php artisan serve works as intended, but once I try to start my Vite runtime, using npm run dev or npm run build I get the following error:

'parent-parent-folder\parent-folder\root-folder\node_modules\.bin\' is not recognized as an internal or external command,
operable program or batch file.
node:internal/modules/cjs/loader:1147
  throw err;
  ^

Error: Cannot find module 'C:\xampp\htdocs\vite\bin\vite.js'
    at Module._resolveFilename (node:internal/modules/cjs/loader:1144:15)
    at Module._load (node:internal/modules/cjs/loader:985:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:135:12)
    at node:internal/main/run_main_module:28:49 {
  		code: 'MODULE_NOT_FOUND',
  		requireStack: []
	}

Right of the bat, I saw some inconsistencies:

  • the first given path in line 1 of my error is going into my parent folders?
  • it is trying to find my vite.js in my htdocs?

I tried the following

  • checking if the folder/file (vite.js) existed in the node_modules (yes it does)
  • following:
npm cache clear --force
# removing the node_modules & lock file
npm install
  • I also tried to reinstall laravel with the laravel new . command. but for some reason it tells me my project already exists (even though I am just telling my project to be installed in my current location and not giving it a name)

I have seen tens of articles recommending me to reinstall the node_modules and clearing my cache, but those have not worked so far.

0 likes
3 replies
LaryAI's avatar
LaryAI
AI
2 years ago
Level 58

It seems like the issue you're encountering is related to the path configuration for Vite within your Laravel project. The error message indicates that the system is unable to find the vite.js file in the expected location. This could be due to the manual movement of files and folders after the initial installation.

Here are some steps you can try to resolve the issue:

  1. Ensure that your package.json file is in the root directory of your project and that it contains the correct scripts for running Vite. It should look something like this:
{
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  }
  // ... other configurations
}

  1. Check that the vite.config.js file is also in the root directory and properly configured.

  2. Since you moved files manually, it's possible that some paths in configuration files are incorrect. Double-check any paths that might be specified in your vite.config.js or other configuration files.

  3. Make sure that your terminal's current working directory is the root of your Laravel project when you run npm run dev or npm run build.

  4. If the issue persists, try deleting the node_modules directory and the package-lock.json file (or yarn.lock if you're using Yarn) and then reinstall the dependencies:

rm -rf node_modules
rm package-lock.json # or yarn.lock
npm install

  1. If you're still facing issues, you might want to check your environment variables and system PATH to ensure that they are not causing any conflicts with node or npm commands.

  2. Lastly, if you've tried all the above and the issue persists, consider cloning your project into a new directory to ensure that there are no hidden files or configurations that are causing the issue:

cd ..
laravel new my-new-project
# Now, copy your project files to this new directory, excluding node_modules and lock files.

Remember to copy over your .env file and any other custom configurations you've made to the new project directory.

If none of these steps resolve the issue, please provide more details about your setup, including the contents of your package.json and vite.config.js files, so that we can further diagnose the problem.

1 like
Basile404's avatar

@LaryAI

The last step: Creating a new laravel app in a different location was indeed a solution, thanks! I could not find any hidden files so I am still not sure what the problem was though.

If someone knows more, I would love to hear about it!

markshowell's avatar

The 'npm install' step installs all of the js modules including vite based on the package.json/package.lock files.

Please or to participate in this conversation.