'Error: Cannot find module 'react-dev-utils/getPublicUrlOrPath'

I have a React.js app which I've deployed on Heroku. Then I have this message:

Browserslist: caniuse-lite is outdated. Please run next command npm update.

So, I run npm update and npm audit fix. When pushing to Heroku again, I get this err :

Error: Cannot find module 'react-dev-utils/getPublicUrlOrPath'

This is what I got when running git push heroku master:

remote: -----> Buildremote:        Running build
remote:        
remote:        > [email protected] build /tmp/build_3b9104b8c72e292510eb4a5bd0494704
remote:        > react-scripts build
remote:        
remote: internal/modules/cjs/loader.js:960
remote:   throw err;
remote:   ^
remote: 
remote: Error: Cannot find module 'react-dev-utils/getPublicUrlOrPath'
remote: Require stack:
remote: - /tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/config/paths.js
remote: - /tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/config/env.js
remote: - /tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/scripts/build.js
remote:     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:957:15)
remote:     at Function.Module._load (internal/modules/cjs/loader.js:840:27)
remote:     at Module.require (internal/modules/cjs/loader.js:1019:19)
remote:     at require (internal/modules/cjs/helpers.js:77:18)
remote:     at Object.<anonymous> (/tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/config/paths.js:13:28)
remote:     at Module._compile (internal/modules/cjs/loader.js:1133:30)
remote:     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10)
remote:     at Module.load (internal/modules/cjs/loader.js:977:32)
remote:     at Function.Module._load (internal/modules/cjs/loader.js:877:14)
remote:     at Module.require (internal/modules/cjs/loader.js:1019:19) {
remote:   code: 'MODULE_NOT_FOUND',
remote:   requireStack: [
remote:     '/tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/config/paths.js',
remote:     '/tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/config/env.js',
remote:     '/tmp/build_3b9104b8c72e292510eb4a5bd0494704/node_modules/react-scripts/scripts/build.js'
remote:   ]
remote: }
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno 1
remote: npm ERR! [email protected] build: `react-scripts build`
remote: npm ERR! Exit status 1
remote: npm ERR! 
remote: npm ERR! Failed at the [email protected] build script.
remote: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
remote: 
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR!     /tmp/npmcache.qnMyP/_logs/2020-05-07T07_23_33_937Z-debug.log
remote: 
remote: -----> Build failed
remote:        
remote:        We're sorry this build is failing! You can troubleshoot common issues here:
remote:        https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:        
remote:        Some possible problems:
remote:        
remote:        - node_modules checked into source control
remote:          https://blog.heroku.com/node-habits-2016#9-only-git-the-important-bits
remote:        
remote:        - Node version not specified in package.json
remote:          https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
remote:        
remote:        Love,
remote:        Heroku 
remote:  !     Push rejected, failed to compile Node.js app. 
remote:  !     Push failed`enter code here`


Solution 1:[1]

try using

npm install --save-dev react-dev-utils

it worked for me every time

Solution 2:[2]

While not on Heroku, I also had a similar issue with the same getPublicUrlOrPath error. I tried npm-install multiple times and got a 404 error from a bad dependency, so I deleted it from package.json, removed the file package-lock.json, then ran npm install --save and all worked fine afterwards.

Solution 3:[3]

I encountered the same issue after running npm audit fix --force and this command ended up creating in package.json under devDependency:

"devDependencies": {
  "compression-webpack-plugin": "^8.0.0",
  "react-dev-utils": "^12.0.0",
  "webpack-dev-middleware": "^3.7.3",
  "webpack-hot-middleware": "^2.25.1"
}

To solve the issue:

  1. I removed node_modules, package.json.

  2. Removed other dependencies created under devDependency and left only:

    "devDependencies": {
      "compression-webpack-plugin": "^8.0.0"
    }
    
  3. lastly I ran npm install --force

That solved my problem on Ubuntu.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 ARPIT DAWAR
Solution 2 halfer
Solution 3 halfer