"react-app-polyfill" doesn't work in IE11
Solution 1
Perhaps the issue is related to the react-scripts version
, you are using react-scripts 3.3.0 and higher. You could check the package.json file to verify it.
There are some thread reports this error in GitHub, you could refer to them, for example: github.com/facebook/create-react-app/issues/8197, github.com/facebook/create-react-app/issues/8195.
As a workaround, you could try to downgrade the react-scripts version. As far as I know, it can still work with [email protected]
.
Solution 2
After adding react-app-polyfill
in your index.js
, it will work for PROD env but you need to update your browserslist
inside package.json
for DEV env
index.js
import 'react-app-polyfill/ie9';
import 'react-app-polyfill/stable';
import React from 'react';
import ReactDOM from 'react-dom';
.
.
package.json
.
.
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version",
"not dead" // new line
]
},
.
.
Related videos on Youtube
![brent jeong](https://lh3.googleusercontent.com/-FOVu6PrTBEM/AAAAAAAAAAI/AAAAAAAAAAA/ACHi3rec644fuZcLWdjZQn1vZGkWuTMn4w/photo.jpg?sz=256)
brent jeong
Updated on June 04, 2022Comments
-
brent jeong about 2 years
My React App is not working on IE 11.
My client wants the app to work on at least ie11.
So, i have to solve this error.I tried the official documentation from "react-app-polyfill". But it still doesn't work.
Please help me.src/index.jsx
import 'react-app-polyfill/ie11'; import 'react-app-polyfill/stable'; import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import * as serviceWorker from './serviceWorker'; import { Provider } from 'react-redux'; import store from './store'; ReactDOM.render( <Provider store={store}> <App /> </Provider>, document.getElementById('root') ); serviceWorker.unregister();
package.json
"dependencies": { ... "@types/jest": "^24.0.25", "@types/node": "^12.12.24", "@types/react": "^16.9.17", "@types/react-dom": "^16.9.4", "@types/react-redux": "^7.1.5", "@types/react-router-dom": "^5.1.3", "axios": "^0.19.0", "install": "^0.13.0", "node-sass": "^4.13.0", "npm": "^6.13.4", "react": "^16.12.0", "react-app-polyfill": "^1.0.5", "react-dom": "^16.12.0", "react-hotkeys": "^2.0.0", "react-redux": "^7.1.3", "react-router": "^5.1.2", "react-router-dom": "^5.1.2", "react-scripts": "3.3.0", "redux": "^4.0.5", "redux-devtools-extension": "^2.13.8", "redux-thunk": "^2.3.0", "typescript": "^3.7.4" }, ... "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "ie 11", "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }
-
oCcSking over 3 yearsgithub.com/facebook/create-react-app/issues/… here he used 3.4.3 and that worked for me also
-
znn about 2 yearsTo me worked locally by updating to: "development": [ ">0.2%", "not dead" ]. Basically same as production. PS: using 'react-scripts 5.0.0' and 'react-app-polyfil 3.0.0'.