create-react-app: dynamic import are unrecognized in 3.0.0-next.b0cbf2ca, compile fails

Is this a bug report?

Yes

Did you try recovering your dependencies?

npm version 6.8.0

Which terms did you search for in User Guide?

Environment

I used the command, but I got an error instead. (node:16088) UnhandledPromiseRejectionWarning: Error: The system cannot find the path specified.

at Function.e.exports.sync (C:\Users\jonas\AppData\Roaming\npm\node_modules\create-react-app\node_modules\envinfo\dist\envinfo.js:1:7778)
at Object.copySync (C:\Users\jonas\AppData\Roaming\npm\node_modules\create-react-app\node_modules\envinfo\dist\envinfo.js:1:104976)
at Object.t.writeSync.e [as writeSync] (C:\Users\jonas\AppData\Roaming\npm\node_modules\create-react-app\node_modules\envinfo\dist\envinfo.js:1:123499)
at C:\Users\jonas\AppData\Roaming\npm\node_modules\create-react-app\node_modules\envinfo\dist\envinfo.js:1:124274    at Promise.all.then.e (C:\Users\jonas\AppData\Roaming\npm\node_modules\create-react-app\node_modules\envinfo\dist\envinfo.js:1:124289)

(node:16088) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwinginside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1) (node:16088) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

I’m on Windows 10

  • node v11.8.0
  • npm v6.8.0
  • react-scripts v3.0.0-next.b0cbf2ca
  • react & react-dom v16.8.1

Steps to Reproduce

(Write your steps here:)

  1. Create a new project with the latest prerelease (3.0.0-next.b0cbf2ca)
  2. Import a module dynamically (eg. const AsyncApp = lazy(() => import(‘./App’)))
  3. npm start -> Failed to compile

Expected Behavior

(Write what you thought would happen.) The build would pass, as it does in previous versions.

Actual Behavior

image

Reproducible Demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

About this issue

  • Original URL
  • State: open
  • Created 5 years ago
  • Reactions: 5
  • Comments: 32 (5 by maintainers)

Commits related to this issue

Most upvoted comments

I finally found a solution that works for me, suggested by @andybarsby and @kylehalleman

https://github.com/facebook/create-react-app/issues/6873#issuecomment-486205976

Running npm i --save-dev acorn-dynamic-import@3 fixes the issue for me. No other solution have worked, I’ve tried all of these:

  • Downgrading node version, as suggested by @ianschmitz
  • Removing package-lock.json and node_modules folder and running npm install
  • Tested different computers (issue still occurs)

Does updating the acorn-dynamic-import dependency solve the issue for anyone else? (for people, where the steps mentioned didn’t solve the issue)

Thank you @joglr

Was facing the same issue. Adding npm i --save-dev acorn-dynamic-import@3 fixed the issue.

It’s unclear if webpack is going to do anything to fix this issue or if it’s just going to be fixed in npm. We’ll keep an eye on the webpack issue and see if they release a new version before we publish 3.0 final.

This bug looks like this bug on webpack, which was root-caused to this bug on npm.

Thank you @joglr!

Proposed workaround works for my reproduction repo as well.

Looking in package-lock.json I can only see 1 other version of acorn-dynamic-import (v4) which is required by webpack. Tracking down something that uses acorn-dynamic-import but doesn’t itself depend on it sounds like the next step towards getting this properly fixed.

@joglr I have this problem and none of the previous suggestions worked for me. I tried your recommendation and can confirm it solves the issue for me

seems something going on package-lock.json. removing it and reinstalling via npm install fixes the problem. also a fresh install of yarn helps.

Repo to reproduce issue https://github.com/Silic0nS0ldier/CRA-6673 Presence of file name makes no difference. I got this running on another device as well to rule out the creation of a bad state. Tried to make sample as simple as possible to constrain area of investigation as much as possible.