admin管理员组

文章数量:1644374

最近使用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删掉重新安装后就可以正常打开了。

本文标签： 空白兼容性问题页面createReact

版权声明：本文标题：解决create-react-app在ie中打开页面空白的兼容性问题 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dongtai/1729383821a1199291.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。