FFFT

主にwebプロダクト開発に関連する話をつらつらと

create-react-appでTypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

しばらくいじっていないcreate-react-appで作ったフロントエンドのアプリケーションをローカル起動させたらこんなエラーが。

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at validateString (internal/validators.js:121:11)
    at Object.join (path.js:1039:7)
    at noopServiceWorkerMiddleware (/Users/me/myapp/frontend/node_modules/react-dev-utils/noopServiceWorkerMiddleware.js:14:26)
    at Layer.handle [as handle_request] (/Users/me/myapp/frontend/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:317:13)
    at /Users/me/myapp/frontend/node_modules/express/lib/router/index.js:284:7
    at Function.process_params (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:335:12)
    at next (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:275:10)
    at launchEditorMiddleware (/Users/me/myapp/frontend/node_modules/react-dev-utils/errorOverlayMiddleware.js:20:7)
    at Layer.handle [as handle_request] (/Users/me/myapp/frontend/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:317:13)
    at /Users/me/myapp/frontend/node_modules/express/lib/router/index.js:284:7
    at Function.process_params (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:335:12)
    at next (/Users/me/myapp/frontend/node_modules/express/lib/router/index.js:275:10)
    at handleWebpackInternalMiddleware (/Users/me/myapp/frontend/node_modules/react-dev-utils/evalSourceMapMiddleware.js:42:7)
    at Layer.handle [as handle_request] (/Users/me/myapp/frontend/node_modules/express/lib/router/layer.js:95:5)

nodeのバージョンアップで何かしらのライブラリが動かなくなってるやつかなーと思いつつ。 通常の起動時のエラーだとターミナルでエラー出てアプリ起動せずのケースがほとんどだと思うんですが、今回は起動して画面にもこのままスタックトレースが表示されたので「いつもとちげぇ....!!!」と少し焦りました。

react-dev-utilsが悪さをしているよう。

対処法は、react-scriptsのバージョンを3.4.0以上に上げれば解消。 問題が起きているアプリケーションのreact-scriptsのバージョンはおそらく3.3.*のはずです。

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.

下記、参考。
github.com github.com

同じエラーで焦った人がこの記事を見つけて焦る時間が減ってくれたら嬉しいです。