3
votes

La version de production de React ne fonctionne pas avec IE 11

Mon projet react utilise express comme backend. Lorsque j'exécute un projet en mode développement en utilisant "npm start" pour React et "node server.js" pour le serveur express, je peux l'utiliser dans Chrome ainsi que dans IE 11. Lorsque je crée une version de production en utilisant "npm run build "et l'exécuter en utilisant" node server.js "cela fonctionne dans Chrome mais dans IE 11 cela ne fonctionne pas. Je ne vois aucune erreur dans la console.

J'utilise les instructions ci-dessous au début de index.js pour rendre le code IE 11 compatible.

import 'core-js / es6 / map'; import 'core-js / es6 / set'; import 'raf / polyfill';

Version React - 16. Projet créé à l'aide de create-react-app.

Je pense que cela ne fonctionne pas car webpack.config.prod.js ne regroupe pas IE 11 code compatible.

reactjs webpack node.js

3 commentaires

Utilisez-vous create-react-app ?

C'est un peu difficile de dire ce qui se passe! Mais essayez de configurer Babel pour qu'il soit compatible avec IE11. C'est peut-être une fonctionnalité JS que IE ne peut pas comprendre. Vérifiez ceci

Keno - Oui, j'utilise create-react-app.

3 Réponses :

1
votes

D'après la documentation officielle:

React prend en charge tous les navigateurs courants, y compris Internet Explorer 9 et supérieur, bien que certains polyfills soient requis pour les navigateurs plus anciens tels que IE 9 et IE 10.

Installez ces deux packages.

"browserslist": [
    ">0.2%",
    "not dead",
    "ie >= 9" ]

Cela doit être la première ligne de src / index.js

import "react-app-polyfill/ie9"
import "react-app-polyfill/ie11"
import "react-app-polyfill/stable"
import 'raf/polyfill';

Vous pouvez également configurer votre manifeste pour gérer différents navigateurs, en utilisant le document suivant: https://github.com/browserslist/browserslist

exemple:

  npm install babel-polyfill
  npm install react-app-polyfill

1 commentaires

Pourquoi babel-polyfill?

3
votes

vous devriez utiliser: react-app-polyfill

Ce paquet inclut des polyfills pour divers navigateurs. Il inclut les exigences minimales et les fonctionnalités de langage couramment utilisées utilisées par les projets Create React App.

Utilisation Tout d'abord, installez le package en utilisant Yarn ou npm:

// These must be the first lines in src/index.js
import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';

// These must be the first lines in src/index.js
import 'react-app-polyfill/ie9';
import 'react-app-polyfill/stable';

Pour IE9:

yarn add react-app-polyfill

Pour IE11:

npm install react-app-polyfill

1 commentaires

Ce doivent être les premières lignes de src / index.js c'est une partie importante

0
votes

importer "react-app-polyfill / ie11"

importer "react-app-polyfill / stable"

La deuxième ligne (react-app-polyfille / stable) a fait l'affaire pour moi. J'essayais de charger une page de réaction dans une application de bureau qui utilise ie11 pour rendre les pages

0 commentaires