dynamic import are unrecognized in 3.0.0-next.b0cbf2ca, compile fails

[nimrossum]

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

Reproducible Demo

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

[ianschmitz]

If you have a chance do you mind trying Node 10.x? We've had some reports of issues on the latest Node 11.x.

I just tested using Node 10.15.1 with the following in my index.js and it worked fine:

const LazyApp = React.lazy(() => import('./App'));

ReactDOM.render(
  <React.Suspense fallback={<div />}>
    <LazyApp />
  </React.Suspense>,
  document.getElementById('root')
);

[ianschmitz]

With regards to envinfo throwing, can you make sure create-react-app isn't installed globally? You can follow the instructions in our docs

[nimrossum]

@ianschmitz

With regards to envinfo throwing, can you make sure create-react-app isn't installed globally? You can follow the instructions in our docs

Ah, thank you. I was wondering why it wasn't working.

[wasker]

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

[iansu]

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.

[iansu]

Is anyone able to reproduce this issue with the latest alpha release?

[cedmax]

@iansu I have the same problem with the v3.0.0 (npm v6.9, node v10.15.1)

./src/index.js 11:9
Module parse failed: Unexpected token (11:9)
You may need an appropriate loader to handle this file type.
| var App = lazy(function () {
>   return import('./local');
| });

[nimrossum]

@ianschmitz
@iansu
I've tried downgrading to node 10.15.3, removing node_modules and package-lock.json and tested the recently released 3.0.0 version.
Can still reproduce.

Envinfo:

• node v10.15.3
• npm v6.4.1
• react-scripts v3.0.0
• OS: Windows 10 Build 1803

./src/index.js 21:9
Module parse failed: Unexpected token (21:9)
You may need an appropriate loader to handle this file type.
| });
| var AsyncApp = lazy(function () {
>   return import('./App');
| });
| ReactDOM.render(React.createElement(MuiThemeProvider, {

Btw, I still get an error with npx create-react-app --info:

Error: EEXIST: file already exists, mkdir 'C:\Users\Jonas'
TypeError: Cannot read property 'get' of undefined
    at errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205:18)
    at C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js:78:20
    at cb (C:\Program Files\nodejs\node_modules\npm\lib\npm.js:228:22)
    at C:\Program Files\nodejs\node_modules\npm\lib\npm.js:266:24
    at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:83:7
    at Array.forEach (<anonymous>)
    at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:82:13
    at f (C:\Program Files\nodejs\node_modules\npm\node_modules\once\once.js:25:25)
    at afterExtras (C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:173:20)
    at C:\Program Files\nodejs\node_modules\npm\node_modules\mkdirp\index.js:47:53
C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205
  if (npm.config.get('json')) {
                 ^

TypeError: Cannot read property 'get' of undefined
    at process.errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:205:18)
    at process.emit (events.js:189:13)
    at process._fatalException (internal/bootstrap/node.js:496:27)
Install for create-react-app@latest failed with code
7

I get this error everytime I try to use npx with either react-scripts or create-react-app. I don't get this error with react-scripts@2
I suspect it has something to do with my user folder containing a space: C:\Users\Jonas Røssum and somehow gets interpreted wrongly.