Ich versuche, ES6-Code in meinem Projekt auszuführen, erhalte jedoch einen unerwarteten Fehler beim Token-Export.
export class MyClass {
constructor() {
console.log("es6");
}
}
javascript
ecmascript-6
webpack
babel
Jason
quelle
quelle
export
nur in ES6 verfügbar ist, und diese Module bieten ES6-Unterstützung.module.exports = MyClass
, nichtexport class MyClass
Antworten:
Sie verwenden die ES6-Modulsyntax.
Dies bedeutet, dass Ihre Umgebung (z. B. node.js) die Syntax des ES6-Moduls unterstützen muss.
NodeJS verwendet die CommonJS-Modulsyntax (
module.exports
) und nicht die ES6- Modulsyntax (export
Schlüsselwort).Lösung:
babel
npm-Paket, um Ihren ES6 auf eincommonjs
Ziel zu übertragenoder
Beispiele für die CommonJS-Syntax sind (von flaviocopes.com/commonjs/ ):
exports.uppercase = str => str.toUpperCase()
exports.a = 1
quelle
import
nativ unterstützen? Ich dachte v10.0.0 hätte es aber anscheinend nicht.Falls Sie diesen Fehler erhalten, hängt dies möglicherweise auch damit zusammen, wie Sie die Javascript-Datei in Ihre HTML-Seite aufgenommen haben. Beim Laden von Modulen müssen Sie diese Dateien explizit als solche deklarieren. Hier ein Beispiel:
Wenn Sie das Skript wie folgt einfügen:
Sie erhalten den Fehler:
Sie müssen die Datei mit einem auf "Modul" gesetzten Typattribut einschließen:
Und dann funktioniert es wie erwartet und Sie können Ihr Modul in ein anderes Modul importieren:
quelle
type
dem ein gültiger MIME- Typ (auch bekannt als Medientyp) erwartet wird, war dies ein unerwarteter Fund. Vielen Dank!<script type="module">import ...</script>
, wenn Sie aus dem Modul importieren. Ich habe es in der neuesten Version von Chromium getestet.Meine zwei Cent
Export
ES6
CommonJS Alternative
Standard exportieren
ES6
CommonJS Alternative
Hoffe das hilft
quelle
Um ES6 zu verwenden, fügen Sie hinzu
babel-preset-env
und in deinem
.babelrc
:Antwort aktualisiert dank @ghanbari Kommentar, um babel 7 anzuwenden.
quelle
babel
vom Autor getaggt . Während Phil Ricketts Antwort das Problem klarstellt, was gut ist, ist diese Antwort eine direkte Lösung für das Problem des Autors.Babel muss derzeit nicht verwendet werden (JS ist sehr leistungsfähig geworden), wenn Sie einfach die Standard-JavaScript-Modulexporte verwenden können. Überprüfen Sie das vollständige Tutorial
Message.js
app.js.
quelle
Installieren Sie die babel - Pakete
@babel/core
und@babel/preset
die konvertiert ES6 zu einem Commonjs Ziel als Knoten js nicht versteht ES6 Ziele direktnpm install --save-dev @babel/core @babel/preset-env
Anschließend müssen Sie eine Konfigurationsdatei mit dem Namen
.babelrc
im Stammverzeichnis Ihres Projekts erstellen und diesen Code dort hinzufügen{ "presets": ["@babel/preset-env"] }
quelle
Ich habe dies behoben, indem ich eine Einstiegspunktdatei wie erstellt habe.
und jede Datei, die ich innerhalb
app.js
und außerhalb importiert habe, hatimports/exports
jetzt funktioniert. Sie führen sie einfach so ausnode index.js
Hinweis: Wenn
app.js
verwendetexport default
, wird diesrequire('./app.js').default
bei Verwendung der Einstiegspunktdatei.quelle
Die Verwendung der ES6-Syntax funktioniert im Knoten nicht. Leider muss babel anscheinend vorhanden sein, damit der Compiler die Syntax wie Export oder Import versteht.
Jetzt müssen wir eine .babelrc-Datei erstellen. In der babelrc-Datei setzen wir babel so, dass beim Kompilieren auf ES5 die Voreinstellung es2015 verwendet wird, die wir als Voreinstellung installiert haben.
Im Stammverzeichnis unserer App erstellen wir eine .babelrc-Datei. $ npm install babel-preset-es2015 --save
Im Stammverzeichnis unserer App erstellen wir eine .babelrc-Datei.
Hoffe, es funktioniert ... :)
quelle