webpack4 + babel7 配置ie兼容

有一说一, 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 使用及场景区别