webpack4 + babel7 配置ie兼容

lllllxt_in_sf

有一说一, IE真是让人头大?‍♂️?‍♂️
以下只给出如何配置, 如果想了解更多请查看文末传送门

安装:
npm i @babel/polyfill -S
npm i @babel/preset-env @babel/plugin-transform-runtime -D

// 根据babel.config.json中corejs 2 / 3, 自行选择安装 @babel/runtime-corejs2 或 @babel/runtime-corejs3
npm i @babel/runtime-corejs3 -D
webpack.config.js
 entry: {
  main: ['@babel/polyfill', './main.js']
 }
babel.config.json
"presets": ["@babel/preset-env"],
"plugins": [
    [
        "@babel/plugin-transform-runtime",
        {
            "corejs": 3
        }
    ] 
]

----------------------- 顺便说一下 ------------------------

开发环境下, 在ie上可能一片空白, 有以下三种方案

  1. build后在ie上调试 [ 可行, 但太麻烦了 ]
  2. devServer inline设置成false [ 可行, 但是iframe模式下, HRM会失效, 需要手动刷新页面 ]
  3. 降低devServer版本到@2.11.1 [ 没试过 ]

再说一遍, IE真真真是让人头大 ???

相关资料转送:
@babel/polyfill
@babel/plugin-transform-runtime
preset-env与plugin-transform-runtime 使用及场景区别

阅读 284

158 声望
0 粉丝
0 条评论

158 声望
0 粉丝
宣传栏