Webpack 使用内联动态导入和网页包进行代码拆分时出现意外令牌

我遵循了关于如何使用Webpack进行代码拆分的教程

但是，在构建时，它不能识别内联

import

s

正常的

import

s，例如

import join from'lodash.join

工作

这样的问题：问同样的问题，但仍然没有答案。因此，我创建了一个存储库，您可以复制它，以更直观的方式观察行为

Git存储库：

git clone https://github.com/jpls93/code-demo && cd code-demo && git checkout unexpected-token-import &&npm install &&npm install && npm run build

Gif演示：

错误消息： 回答：

// package.json
 "devDependencies": {
+ "babel-plugin-syntax-dynamic-import": "^6.18.0",

// webpack.config.js
 options: {
   presets: ["env"],
+  plugins: ["syntax-dynamic-import"]
 }

---

谢谢@andykenward。看到你的了。

你需要将插件添加到你的babel配置中

我已经完成了你的回购协议并承诺了修复。看

但在使用async和Wait时，您将遇到另一个错误。

当您在

webpack.config.js

中使用babel配置时，默认设置是为最后两个版本的浏览器（包括IE 10）编译

因此，您需要为希望支持的浏览器配置babel配置，并添加。我有一个快速修复程序，它使用默认浏览器并在中预设。我已经打开了，所以你可以看到什么巴贝尔插件正在使用

---

您还可以使用来支持异步。但我发现使用config更好，因此您可以在可能的情况下使用本机浏览器代码。

谢谢。我回答得太慢了。