Endless Loop: Cannot find 'cross-spawn'

Question

Problem

I am stuck in a loop where running npm run watch says it cannot find cross-spawn.

> @ watch /Users/donnie/Github/laravel_project
> npm run development -- --watch


> @ development /Users/donnie/Github/laravel_project
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js "--watch"

module.js:549
    throw err;
    ^

Error: Cannot find module 'cross-spawn'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/donnie/.yarn-cache/npm-cross-env-5.2.0/dist/index.js:5:19)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js "--watch"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/donnie/.npm/_logs/2019-01-22T21_57_39_199Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ watch: `npm run development -- --watch`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ watch script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/donnie/.npm/_logs/2019-01-22T21_57_39_227Z-debug.log

I run npm i --D cross-spawn which is successful, then npm run watch again. It says there are a few more dependencies that must be installed (which is strange because the first thing I did was npm install.) Anyway, it finally provides this feedback:

Okay, done. The following packages have been installed and saved to your package.json dependencies list:

- vue-template-compiler
- sass-loader@7.*
- sass
- [email protected]

Finished. Please run Mix again.

Cool. So I run npm run watch again and we're right back to the cross-spawn problem.

I've tried deleting /node_modules and starting fresh. No luck.

🤔

package.json

{
  "devDependencies": {
    "axios": "^0.18",
    "bootstrap": "^4.0.0",
    "cross-env": "^5.1",
    "cross-spawn": "^6.0.5"
    "false": "^0.0.4",
    "jquery": "^3.2",
    "laravel-mix": "^4.0.7",
    "lodash": "^4.17.5",
    "popper.js": "^1.12",
    "resolve-url-loader": "2.3.1",
    "sass": "^1.16.1",
    "sass-loader": "7.*",
    "vue": "^2.5.17",
    "vue-template-compiler": "^2.5.22"
  },
  "dependencies": {}
}

Environment

• npm: 6.3.0
• laravel: 5.7

Answer 1

Running npm rebuild then npm install should fix the problem. Now, running npm run dev should build fine.

I believe this issue has something to do with bad file permissions and npm rebuild seems to sort things out.

Answer 2

Ran into a similar issue with craco.

The following fixed it for me:

rm -rf node_modules
rm package-lock.json
npm install

Edit: I should mention that this is less than optimal. Removing your lock file is generally a bad idea and can result in dependency conflicts. In my specific case, it didn't matter, but it may matter in yours. Take precautions if you plan on applying this "fix" (create a backup if you don't use git).