I am facing one app crash issue in ie11. App is working fine with all browsers but IE.
on some post I found to uncomment the following lines in polyfills.ts
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';
After un-commenting these lines application is working on IE 11.0.38 (KB203621).
But it is still crashing on IE 11.0.96 (KB4040685). Browser itself stops working while trying to load the app.
If anybody have faced this kind of issue before, please provide your valuable suggestions to resolve this issue.
Thanks & Regards,
Most ES6 features are not supported in IE 11.
take a look at this to get an idea https://kangax.github.io/compat-table/es6/
Related
WebStorm doesn't detect this import from react. I always have to explicitly type it.
import React, {useState} from 'react'
This is kind of boring when working with many files.
NOTE: it does detect & autocomplete imports from current project. But doesn't detect/autocomplete any import from node_modules folder mostly.
Upgrading Webstorm to 2021.1 solved the issue. Thanks Lena for the comment.
I am new to SP dev fx components and have used react-calendar linked react-calendar. I works fine on Chrome, Firefox but gives error
Object doesn't support property or method 'from'
on Internet Explorer. I have seen that it is because of Polyfill not supported with IE11. I tried to add
import 'core-js/modules/es6.promise'
import 'whatwg-fetch'
import 'core-js/modules/es6.array.iterator.js'
import 'core-js/modules/es6.array.from.js'
import 'es6-map/implement'
but got this error now
in Uncontrolled(Component)in ForwardRefin divin divin divin Unknownin Unknown
I am very new to this and not sure where else to look. Can anyone suggest me what wrong has happened.
Regards,
Saghir
Im trying to implement the library Shufflejs together with ReactJS. Im trying to implement the samplecode for react but when I after installed Shufflejs with npm install shufflejs and paisted the code into index.js in my React application my page renders blank.
I'm a bit lost why that is. Any help would be appreciated!
the code is here on shufflejs: https://vestride.github.io/Shuffle/js/demos/react.js
The way you load Shuffle is not correct here. Replace the import statements with
import React, { Component } from 'react'
import ReactDOM from "react-dom";
import Shuffle from 'shufflejs'
I have created a new reactjs project using create-react-app and am finding it's not working on IE10 & IE9. I have done a lot of research and it led me to using polyfills, which I have done with many of my other Rails on React app, but I'm finding it not working with this project created via create-react-app.
Here's the error:
SCRIPT5009: 'Map' is undefined
I notice this error is related to ES6's new Map() function.
So, here's what I've done in my code in an attempt to make it work:
import './polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { BrowserRouter } from 'react-router-dom';
import 'bootstrap/dist/css/bootstrap.min.css';
const app = (
<BrowserRouter basename={process.env.PUBLIC_URL}>
<App />
</BrowserRouter>
);
ReactDOM.render(app, document.getElementById('root'));
Polyfill.js:
import 'core-js/es6/map';
import 'core-js/es6/set';
import 'core-js/fn/object/assign';
This isn't working. I'm not sure what else to try. I've tried a lot of other polyfill imports as well and continue to get the same error.
Any help would be appreciated!
So, seeing as though create-react-app is what's restricting me from controlling the webpack config, I decided to take a different approach and build a fresh react app using webpack 4. I followed this article, https://dev.to/saigowthamr/how-to-create-a-react-app-from-scratch-using-webpack-4-1909.
This allowed me more control over the webpack config and now the polyfill loaders are working.
Nevertheless, if anyone has an explanation as to why it wasn't working with create-react-app, I think it'd be helpful for the community to know.
Thanks!
I built an application using jhipster v5.3.4 choosing React option for frontend. It works fine with Edge and Chrome but renders a blank page on Internet Explorer 11.
I've read the solution is install and include babel-polyfill but I´m not sure how to do this.
What I've done:
npm install --save-dev babel-polyfill
At the top of index.tsx, add import babelPolyfill from 'babel-polyfill';
The result is the same, blank page and console error: "Symbol is undefined"
Finally the answer to make it works is:
import React from 'react';
import ReactDOM from 'react-dom';
import 'babel-polyfill';