webentwicklung-frage-antwort-db.com.de

ReactJS - SCRIPT1010: Erwarteter Bezeichner - Produktionsbuild wird nicht auf IE11 ausgeführt

Ich habe heute ein neues Projekt mit der create-react-app erstellt. Der Produktions-Build läuft unter IE11 nicht einwandfrei, die Konsole zeigt folgenden Fehler an:

SCRIPT1010: Expected identifier

Die Zeile, auf die es in meiner main.js zeigt:

{var n=e&&e.__esModule?function(){return e.default}:function(){return e};

Der Fehler ist nach dem oben genannten E. (Standard). Mein Paket json ist klar:

{
  "name": "sample-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.3.1",
    "react-dom": "^16.3.1",
    "react-scripts": "1.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

Seltsamerweise funktioniert mein Dev-Server perfekt auf IE11, so dass es nur Probleme mit der Produktionserstellung gibt. Es funktioniert auch gut auf Chrome. Muss ich Polyfills haben?

8
Vishal Gulati

So habe ich es behoben. Nicht zu vergessen Mr. React "Dan Abramov" hat mir dabei geholfen.

Das Problem ist daher standardmäßig, dass die Anwendung auf IE7 gerendert wurde und nicht auf IE IE11/Edge liegt, der den transpilt build unterstützt. Daher musste ich die Metainformationen erwähnen, um den Browser darüber zu informieren, dass der beabsichtigte Browser IE11/Edge ist. Fügen Sie dies im Abschnitt head Ihrer index.html hinzu:

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

Nun, wie ich bekam, sehen Sie in der Konsole auch einen Fehler, der lautet: 

SCRIPT5009: 'Set' is undefined

Keine Sorge, da gibt es auch einen Weg: https://reactjs.org/docs/javascript-environment-requirements.html

Hier ist das Thema, das ich mit Dan über git besprochen habe: https://github.com/facebook/create-react-app/issues/4255

0
Vishal Gulati

Es scheint, dass die Reihenfolge der Polyfills auch ein Faktor ist. Dieses Problem enthält mehrere Lösungen, die zur Lösung dieses Problems beitragen können. https://github.com/facebook/react/issues/8379

1
Vidro3

Sie müssen babel-polyfills einschließen und auf ES5 übergehen, damit IE11 funktioniert.

Reaktion 16 hängt von den Sammlungstypen Map und Set ab. Wenn Sie .__ unterstützen. ältere Browser und Geräte, die diese Funktionen möglicherweise noch nicht bieten (z. B. IE <11) oder die nicht kompatible Implementierungen haben (z. B. IE 11), ziehen Sie in Betracht, eine globale Polyfill-Komponente in Ihre gebündelte Anwendung aufzunehmen. wie Core-Js oder Babel-Polyfill.

https://reactjs.org/docs/javascript-environment-requirements.html

Sie können eine Füllung über das Webpack wie folgt hinzufügen

entry: {
      app: [
        'babel-polyfill',
        'react-hot-loader/patch',
        'react',
        'react-dom',
        './src/index.web.tsx',
      ]
},
0
Paul Mcloughlin

Dies ist IE Problem, nicht reagieren Rahmen.

das Problem, dass "default" ein reserviertes Word im IE ist

sie können die "Standard" -Funktion in einen neuen Namen umbenennen oder die Javascript-Funktion wie folgt verwenden:

return e["default"]
0
mzoabi