由于 ie 浏览器需要兼容的需求在现在已经越来越少了，所以 react 脚手架对这部分不进行兼容了，但我们可以安装 polyfill 解决。

而目前解决方法就是安装 create-react-app，然后使用。

1
npm install react-app-polyfill

然后src/index.js里添加

1
2
3
// 注意一定要在最顶部添加，否则无效
import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';

再然后修改 package.json 里面的 browserslist 就可以了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all",
      "ie 11"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version",
      "ie 11"
    ]
  },

这个需要在ie 11一定要添加，并且建议加到数组的最后。

还有就是最好把 nodemodules 里的所有包都重新安装一次，因为可能我们的配置并没有生效，这是因为 babel-loader 没有检测到 package.json 中的改变，一个最简单的解决方式就是直接删除掉 node_modules/.cache 文件夹，重新编译。

这样我们就可以兼容 ie11 的版本了。

当然，如果 ie11 还报错,可以试一下把babel-polyfill也安装上。

1
npm i babel-polyfill -S

然后在 webpack 的配置文件的 entry 里添加"babel-polyfill"。

1
2
3
4
entry:[
    "babel-polyfill",
    "src/index.js"
]