菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
21
0

create-react-app兼容ie11配置

原创
05/13 14:22
阅读数 1794

今天闲来无事折腾一下create-react-app,发现主流浏览器都没有问题。但是ie11却一直报错,真是倔强的很啊。
我翻了下create-react-app的文档,从中看到了正好有对ie9、ie10、ie11的兼容性问题解决的一个方案。这时需要用到react-app-polyfill这个插件。

文档地址:
https://facebook.github.io/create-react-app/docs/supported-browsers-features
create-react-app github地址:
https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill

下载安装这个插件
npm install react-app-polyfill
然后在src下的index.js也就是js入口文件中首行写入

import "react-app-polyfill/ie11";
import "react-app-polufill/stable";
image.png
然后根据官网的提示,还需要在package.json文件中的browserslist中添加ie11
image.png
最后重新运行项目发现还是空白但是浏览器没有报错,把node_moudles删掉重新安装或者删除目录下面的.cache后重新npm start就可以正常打开了。

如果create-react-app是3.3.0版本的话还需要修改另外一个地方,IE11才不会报错。
issue:https://github.com/facebook/c...
./node_modules/react-dev-utils/webpackHotDevClient.js:60增加slashes: true
image.png
至此就能在IE11上面看到熟悉的标志啦。
image.png

发表评论

0/200
21 点赞
0 评论
收藏
为你推荐 换一批