Error when running npm start with react-scripts 3.3.1 after updating dependencies

Describe the bug

Latest version of react-dev-utils breaks compatibility with old react-scripts.

Did you try recovering your dependencies?

yes

Which terms did you search for in User Guide?

n/a

Steps to reproduce

npx create-react-app bug-test then npm install react-scripts@3.3.1 then npm start.

Expected behavior

Runs webpack-dev-server and watches and compiles files.

Actual behavior

Throws an exception when accessing the page.

The latest version of react-scripts invokes noopServiceWorkerMiddleware with a path, while the previous version did not. This breaks the watch command since the middleware is now joining on undefined, throwing an exception.

This is because react-scripts@3.3.1 pulls in react-dev-utils@10.2.0 since it is versioned with a caret.

TypeError [ERR_INVALID_ARG_TYPE]: The “path” argument must be of type string. Received type undefined at validateString (internal/validators.js:125:11) at Object.join (path.js:1147:7) at noopServiceWorkerMiddleware (/Users/*/projects/bug-test/node_modules/react-dev-utils/noopServiceWorkerMiddleware.js:14:26)

Reproducible demo

Can make one if needed.

[voxtex]

Yes upgrading to 3.4.0 fixes it, as does pinning react-dev-utils to previous version. However all projects running react-scripts 3.3.* without dependencies lock (or after npm update) will be broken unless react-dev-utils is fixed to handle the undefined argument. It isn’t a hassle for me, really appreciate all the good work in CRA, just helping those that encounter the error.

[bploetz]

Thanks for digging into this @voxtex . I was losing my mind all afternoon trying to figure out what I had changed that broke my app. "react-scripts": "^3.4.0" fixes this issue for me as well.