[英]React app is not working in IE 11 browser
I have seen a lot of similar questions here and I have tried all the ways but I have no idea why still not showing anything.我在这里看到了很多类似的问题,我已经尝试了所有方法,但我不知道为什么仍然没有显示任何内容。
npm install react-app-polyfill npm install react-app-polyfill
I added "ie 11" to production and development array in package.json我在 package.json 的生产和开发数组中添加了“ie 11”
Add this two-line import "react-app-polyfill/ie11";
添加两行
import "react-app-polyfill/ie11";
import "react-app-polyfill/stable";
to top of index.js
到
index.js
顶部
delete .cache folder inside node_modules删除 node_modules 中的 .cache 文件夹
Restart App重启应用
But still not showing anything in ie 11.但仍然没有在 ie 11 中显示任何内容。
Here is my package.json这是我的 package.json
{
"name": "firealarm",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.3",
"@testing-library/user-event": "^7.1.2",
"antd": "^3.26.2",
"axios": "^0.19.0",
"core-js": "^3.6.1",
"cors": "^2.8.5",
"jspdf": "^1.5.3",
"jspdf-autotable": "^3.2.11",
"react": "^16.12.0",
"react-app-polyfill": "^1.0.5",
"react-dom": "^16.12.0",
"react-router-dom": "^5.1.2",
"react-scripts": "3.3.0"
},
"scripts": {
"start": "set PORT=3006 && react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
"ie 11",
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"ie 11",
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
I even remove the node_modules folder and install npm
again but still not working.我什至删除了 node_modules 文件夹并再次安装
npm
但仍然无法正常工作。
Update更新
I got two error message in IE 11.我在 IE 11 中收到两条错误消息。
SCRIPT5022: SyntaxError
File: 0.chunk.js, Line: 176128, Column: 38
And和
SCRIPT5022: The error you provided does not contain a stack trace.
File: 0.chunk.js, Line: 205780, Column: 64
. .
What is your react-scripts
version?你的
react-scripts
版本是什么? It seems an issue with react-scripts
version 3.3.0. react-scripts
版本 3.3.0 似乎存在问题。 You could find the issue report in GitHub: issue 1 , issue 2 .您可以在 GitHub 中找到问题报告: issue 1 , issue 2 。
It can still work with react-scripts@3.2.0
.它仍然可以与
react-scripts@3.2.0
一起react-scripts@3.2.0
。 You could try to revert back to 3.2.0 as a workaround.您可以尝试恢复到 3.2.0 作为解决方法。 Please also remember to delete
.cache
folder in node_modules
and delete IE browser cache then try again.也请记住删除
.cache
文件夹中node_modules
和删除IE浏览器的缓存然后再试一次。
Go to > /node_modules/react-dev-utils/webpackHotDevClient.js:60;转到 > /node_modules/react-dev-utils/webpackHotDevClient.js:60; add slashes: true
添加斜线:true
Below is the code sample下面是代码示例
{
// Connect to WebpackDevServer via a socket.
var connection = new WebSocket(
url.format({
protocol: window.location.protocol === 'https:' ? 'wss' : 'ws',
hostname: window.location.hostname,
port: window.location.port,
//Hardcoded in WebpackDevServer
pathname: '/sockjs-node',
slashes: true,
})
);
}
I just tested on edge browser, npm start
gives the same error you mentioned, but you say that you just want to run your app on ie11.我刚刚在边缘浏览器上进行了测试,
npm start
给出了与您提到的相同的错误,但是您说您只想在 ie11 上运行您的应用程序。 I did npm run build
and served it via serve
package(after npm i -g serve
), it works fine.我做了
npm run build
并通过serve
包提供它(在npm i -g serve
),它工作正常。 Unless until if you would like to development in ie, if you are able to run your app on ie locally that will help I guess.除非您想在 ie 中进行开发,如果您能够在 ie 上本地运行您的应用程序,我猜这将有所帮助。
在 .bablerc 或 babel-config {loose:true} 中添加 @babel/preset-env 它对我有用
"@babel/preset-env": { "targets":">0.2%, not dead","loose":true}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.