IE11 的 Swiper v4 转换失败（使用 Webpack 5 + Babel 7）

Question

我构建并推送了我想做的事情的简化版本：

https://github.com/vaxul/swiper4-webpack5-babel7

应该做什么

当在 Internet Explorer 11 (IE11) 中打开index.html时，使用Swiper进行幻灯片放映即可。

发生了什么事

IE11 抛出错误：

SCRRIPT1002: Syntax error

vendors.js (3135,1)

这是由第 3135 行class中的声明引起的。

我必须使用Swiper v4，因为它是 IE11 的最后一个兼容版本。

Webpack 5的当前设置使用Babel 7和Bootstrap 中的浏览器列表。

babel的debug显示：

...

Using targets:

{

  "android": "4.4",

  "chrome": "45",

  "edge": "12",

  "firefox": "38",

  "ie": "10",

  "ios": "9",

  "opera": "30",

  "safari": "9",

  "samsung": "12"

}

...

Using plugins:

...

transform-classes { "android":"4.4", "chrome":"45", "edge":"12", "firefox":"38", "ie":"10", "ios":"9", "opera":"30", "safari":"9" }

...

当查看示例类的结果时，您可以看到类的转换正在运行：

https://github.com/vaxul/swiper4-webpack5-babel7/blob/master/dist/js/source_Slider_mjs.239afbde125d3f32e9af.js #L18

但它并没有改变node_modules/dom7/dist/dom7.modular.jsclass Dom7中的提及。

目前我不知道为什么它不起作用。

从我的角度来看，我希望这babel-loader将转换所有代码，包括node_modules.

我真的希望有人给我一个提示并指出我正确的方向。请。😊

编辑1

.babelrc重命名为babel.config.json并添加一些配置后babel-loader， 的代码class Dom7已正确转换。

但是，现在我在每个浏览器中都面临着以下错误：

ES模块不能分配module.exports或exports.*，使用ESM导出语法，而是：WA63

Answer 1

工作版本： https ://github.com/vaxul/swiper4-webpack5-babel7关键变化：重命名.babelrc为babel.config.json更新Webpack 配置babel-loader中的选项放babelrc: false排除core-js并webpack/buildin形成转换