8.0.0 - dynamic import causing 'You may need an appropriate loader...' error

[dunika]

Bug report

Just upgraded to 8.0.0 and I'm really excited! I've run into an issue though that is preventing my project from compiling

Describe the bug

So when I run dev I am getting the following issue

You may need an appropriate loader to handle this file type.
| 
| 
> import('./noop');
| var _window = window,
|     assetPrefix = _window.__NEXT_DATA__.assetPrefix;

It seems to be coming from webpack 4.29.0 (see here).

It looks like the issue was fixed with this which declared acorn": "^6.0.5 as a dependency but the change doesn't seem to be present on master

Maybe I upgraded too soon?

[dimensi]

I got same problem. Can't start develop mode. I updated npm to the latest version and also tried to install the acorn package, but did not help.
@timneutkens

[AndrewIngram]

I have a different error related to imports which might have the same root cause:

/Users/andrewingram/Repositories/tego/website-next/node_modules/@babel/runtime-corejs2/helpers/esm/typeof.js:1
(function (exports, require, module, __filename, __dirname) { import _Symbol$iterator from "../../core-js/symbol/iterator";
                                                                      ^^^^^^^^^^^^^^^^

SyntaxError: Unexpected identifier

Everything is fine if I downgrade to next@7.0.3

[timneutkens]

@AndrewIngram can you provide a reproduction? curious to look into that one. It sounds related to @babel/runtime, not webpack.

[incleaf]

I'm facing the same error. Installing acorn doesn't work for me either. FYI, I use ts-node for running my express server.

[TomiTakussaari]

For me this was fixed by upgrading @babel/core:

-        "@babel/core": "^7.1.0",
+        "@babel/core": "7.2.2",

For some reason we have that as direct dependency currently.

[cnasc]

Experiencing same issue and error message. @babel/core is set to "7.2.2" so that may not be the issue.

[iaincollins]

We are also seeing this issue and followed the threads for a workaround.

• Production (with next build) builds and runs fine.
• Running in development mode produces the same error as OP.
• We invoke Next.js programmatically (we use it with Express currently).
• Updating @babel/core to 7.2.2 did not resolve this for us.

Following the the issues linked in the thread and installing webpack@4.28.4 and @babel/core@7.2.2 as devDependancies did resolve this.

(This also resolved the error about the Acorn package, which we do not have as a direct dependancy.)

[kpoelhekke]

I had the same issue, also after updating webpack and @babel/core. Removing my package-lock.json and node_modules and doing a fresh install solved the issue.

[jescalan]

Same issue here, unfortunately. Here's a replication: https://github.com/jescalan/nextjs-test/tree/je.canary

Static build and export works wonderfully, it's just dev mode that errors. Neither babel nor webpack are installed as dependencies.

[jescalan]

Just fixed with with a removal of package-lock.json and regenerate. The last commit on that branch shows which updates were made to package-lock.json -- hopefully this helps to pin down the cause!

[pdlug]

Removing node_modules and package-lock.json then reinstalling resolved this for me as well.

[bitmap]

Deleting node_modules and package-lock.json didn't resolve this for me, but installing webpack@4.28.4 as a dev dependency did, as @iaincollins suggested.