Error when running npm start with react-scripts 3.3.1 after updating dependencies #8490
Comments
|
Same error here. I was going crazy, thinking I did something bad in my config or stuff, till I finally check issues here. |
|
I saw the same today as well, seems to be fixed on 3.4.0. Looks maybe related to projects that have completely removed the service worker file. Reproduced here: |
|
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. |
|
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. |
|
Yes... Upgrading to 3.4.0 Fixes the issue... Thank you @voxtex |
The error: ``` TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. "Received type undefined" ``` The fix: Upgrade react-scripts to 3.4.0 Reference: facebook/create-react-app#8490
|
Closing as it was fixed in |
|
Just as an FYI: updating to
due to how (to be clear: I love |
|
@jamesplease Any way you could elaborate on these two bullet points? I'm working on an interview assessment right now where the provided boilerplate renders this error to the browser. I've updated my package.json with v3.4.0 and updated the yarn.lock to be in sync, however I still get the error when rebuilding the docker-compose. Some of the containerization is a bit over my head, but I'm trying to debug it myself before going to my contact at the company. |
Worked for me! |
|
@robicano22 sure, I can elaborate, although what I described won't cause the same error in the opening post of this issue. If you're still seeing that error, you may need to be sure that Anyway, let me elaborate on what I meant: Let's assume you're on 3.3.1, your project uses React Router, and you host your app at With this setup, your app is located at Because of this difference between the prod and dev, you likely have some kind of conditional statement in your code to set the const basename = process.env.NODE_ENV === 'production' ? '/my-react-app' : '/';
return (
<Router basename={basename}>
<App/>
</Router>
);You may also use a similar conditional to reference assets in your app. All of these conditionals will break when updating to As a heads up, even with
while in prod it will be:
and these two values won't always be compatible with every API. i.e.; const publicUrl = process.env.PUBLIC_URL ?? '/';
const hasProtocol = /^http/.test(publicUrl);
let historyBasename;
if (hasProtocol) {
// NOTE: you don't need to change "placeholder.com" here. It's literally
// a placeholder, and works for every project.
const url = new URL(publicUrl, 'http://placeholder.com');
historyBasename = url.pathname;
} else {
historyBasename = publicUrl;
}
console.log('You can pass this into React Router now', historyBasename); |
|
@jamesplease you're a god sent, thank you! |
Summary: Loading dagit would cause the following error: ``` The "path" argument must be of type string. Received undefined ``` This was an issue in `react-scripts`. Upgrading to 3.4.0 resolves the error Context: facebook/create-react-app#8490 facebook/create-react-app#8519 Test Plan: `yarn install`, run dagit Reviewers: prha, alangenfeld, catherinewu, schrockn Reviewed By: prha, schrockn Subscribers: schrockn Differential Revision: https://dagster.phacility.com/D2111
This is because of a breaking dependency in [email protected] Context: facebook/create-react-app#8490
|
Encountered the issue that @jamesplease mentioned as I was using a router! Just setting |
|
If you aren't able to upgrade |
it's work |
Hey im having the same issue could you please tell me what is going wrong TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined |
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-testthennpm install [email protected]thennpm 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 [email protected] pulls in [email protected] since it is versioned with a caret.
Reproducible demo
Can make one if needed.
The text was updated successfully, but these errors were encountered: