打包编译后IE SCRIPT1002: 语法错误,打包后有箭头函数,webpack如何编译打包ES5?

1,268 阅读1分钟

image.png

打包后使用 IE浏览器打开控制台报错 SCRIPT1002: 语法错误,在chrome浏览器打开正常。说明是有IE无法识别的语法导致JS报错。

排查: 1.打开app.xxxx.js文件查看,发现打包后的代码里面有 ES6 的语法糖

image.png

找到问题了,那就查阅 webpack 的编译如何配置编译成 ES5 代码。webpack的target配置可以指定项目代码要编译的目标类型,web、node、electron等。

webpack 构建目标(Targets)文档

根据文档我们增加以下配置

webpackConfig = {
    ...
    target: ['web', 'es5'],
}

编译后可以看到,箭头函数已经转译成普通函数

image.png