admin管理员组文章数量:1644419
最近使用react官方脚手架create-react-app建立项目的时候发现在ie浏览器打开时显示空白,在主流的chrome、fireFox等浏览器显示是正常的。
打开控制台显示如下
既然提示了语法错误,那么猜想应该是兼容性的问题,看了下浏览器的版本号是ie11。首先我翻了下create-react-app的文档,从中看到了正好有对ie9、ie10、ie11的兼容性问题解决的一个方案。这时需要用到create-react-app这个插件。
文档地址:
https://facebook.github.io/create-react-app/docs/supported-browsers-features
create-react-app github地址:
https://github/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-polyfill/stable";
根据官网的提示,还需要在package.json文件中的browserslist中添加ie11
"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"
]
}
最后重新运行项目发现还是空白但是浏览器没有报错,把node_moudles删掉重新安装后就可以正常打开了。
版权声明:本文标题:解决create-react-app在ie中打开页面空白的兼容性问题 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://www.elefans.com/dongtai/1729383821a1199291.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论