Wie starte ich die Node.js-App mit aktivierten ES6-Funktionen?


78

Ich verwende den Require- Hook von BabelJS (früher 6to5 genannt), um Node-Apps mit es6features auszuführen :

// run.js
require("babel/register");
require("./app.js6");

Ich rufe node run.jsan, um meine app.js6 auszuführen . Ich muss BabelJS installieren und für jedes Projekt, das ich es6features verwenden möchte , eine run.js bereitstellen. Ich würde einen Anruf wie bevorzugen nodejs6 app.js6. Wie kann ich dieses System unabhängig erreichen (Unix und Windows)?


Haben Sie darüber nachgedacht, io.js anstelle von NodeJS + Babel zu verwenden? iojs.org/en/index.html
Jahed

Ich wusste nicht, io.js. Sieht gut aus , aber im Gegensatz zu BabelJS nicht unterstützt wird Rest Argumente .
Maiermic

1
Richtig. Behalte es im Auge, es bewegt sich im Gegensatz zu NodeJS schnell, also bin ich sicher, dass es bald unterstützt wird.
Jahed


Antworten:


138

Fügen Sie die Abhängigkeiten babel-cliund babel-preset-es2015(auch bekannt als ES6) zur Datei package.json Ihrer App hinzu und definieren Sie ein startSkript:

{
  "dependencies": {
    "babel-cli": "^6.0.0",
    "babel-preset-es2015": "^6.0.0"
  },
  "scripts": {
    "start": "babel-node --presets es2015 app.js"
  }
}

Anschließend können Sie einfach den folgenden Befehl ausführen, um Ihre App auszuführen:

npm start

Wenn Sie sich jemals dazu entschließen, Babel nicht mehr zu verwenden (z. B. wenn Node.js alle ES6-Funktionen unterstützt), können Sie es einfach aus package.json entfernen:

{
  "dependencies": {},
  "scripts": {
    "start": "node app.js"
  }
}

Ein Vorteil davon ist, dass der Befehl zum Ausführen Ihrer App derselbe bleibt. Dies ist hilfreich, wenn Sie mit anderen Entwicklern zusammenarbeiten.


20
Es ist zu beachten, dass die Babel-Dokumente ausdrücklich vor der Verwendung von Babel-Node in der Produktion warnen .
Phil

5
Was ist mit nodemonoder anderen mit Ihren Einstellungen? Laden Sie den Server wirklich jedes Mal manuell neu, wenn Sie während der Entwicklung Änderungen an Dateien vornehmen?
Green

Aus den Dokumenten: Sie sollten babel-node nicht in der Produktion verwenden. Es ist unnötig schwer und verbraucht viel Speicher, da der Cache im Speicher gespeichert ist. Außerdem tritt immer eine Beeinträchtigung der Startleistung auf, da die gesamte App im laufenden Betrieb kompiliert werden muss.
Felipe Martim

Update: es von 2017 ist das bevorzugte gemeinsame Preset Preset-Env . Und solange das installiert ist, muss es nicht einmal angegeben werden ...
Frank Nocke

... also solange babel-cliund preset-envinstalliert ist und wenn Sie Dinge direkt mögen (ohne npm run ... und die package.json-Bearbeitung erforderlich), lautet der Befehl (ausgegeben vom Projektstamm):$> ./node_modules/.bin/babel-node yourToolhere.js
Frank Nocke

39

So konfigurieren Sie die node.js-App mit es6-Unterstützung und Server-Reload beim Dateiwechsel .


I.Konfigurationsschritte (Projekt von Grund auf neu erstellen):

1.Gehen Sie im Terminal zu Ihrem Projekthauptverzeichnis

npm init // Erstelle package.json für das Projekt

2. Installieren Sie Abhängigkeiten

npm install --save-dev babel
npm install --save-dev babel-cli
npm install --save-dev babel-preset-es2015
npm install --save-dev babel-preset-stage-0 //*1
npm install --save-dev nodemon

1 - es kann auch Stufe 1 oder 2 sein, es hängt davon ab, welche Funktionen von es Wir verwenden möchten

3.Wir sollten in der Datei package.json so etwas haben (sicher wird die Paketversion anders sein, aber es ist in Ordnung):

"devDependencies": {
  "babel": "^6.5.2",
  "babel-cli": "^6.16.0",
  "babel-preset-es2015": "^6.16.0",
  "babel-preset-stage-0": "^6.16.0",
  "nodemon": "^1.11.0"
}

4.Erstellen Sie die .babelrc-Datei im Stammprojektverzeichnis (es gibt die Datei package.json).

{
 "presets": ["es2015", "stage-0"]
}

5.Erstellen Sie zwei Verzeichnisse:

src - hier ist ein Arbeitsverzeichnis mit Dateien, die in es6 geschrieben wurden

dist - hier werden Dateien mit babel zu es5 kompiliert

Ihr Projektstammverzeichnis sollte folgendermaßen aussehen:

  • Projekt
    • src
      • index.js // Hauptprojektdatei
    • dist
    • package.json
    • .babelrc

7. Fügen Sie zu package.json die erforderlichen Befehle hinzu:

"scripts": {
  "watch": "babel -w src/ -d dist/",
  "build": "babel src/ -d dist/",
  "serve": "babel -w src/ -d dist/ | nodemon --watch dist",
  "test": "echo \"Error: no test specified\" && exit 1"
}

8. Verfügbare Befehle:

npm run watch // startet watch watch Änderungen im src Verzeichnis und kompiliert in dist

npm run build // kompiliert Dateien aus dem src-Verzeichnis nach dist

npm run serve // Es wird der Knotenserver überwacht + gestartet. Bei jeder Dateiänderung wird der Knotenserver mit nodemon neu gestartet, das die Änderungen des dist-Verzeichnisses überwacht

9. Schlussbemerkungen

  • Der Server führt die Datei dist / index.js als Hauptdatei aus.
  • Die Datei dist / index.js wird aus src / index.js kompiliert, daher sollte eine Hauptdatei des Projekts vorhanden sein.
  • dist-Verzeichnis sollte hinzugefügt werden, um von git ignoriert zu werden (aber nicht für npm zu ignorieren, wenn es sich um ein Knotenpaket handelt)

10. Führen Sie den Server aus und erstellen Sie die App im Verzeichnis src .

npm run serve

II. Einfachere Möglichkeit (gebrauchsfertige Boilerplate)

Wenn es zu viele Punkte für Sie sind, ist auf github eine vollständige Woking-Boilerplate verfügbar - https://github.com/maciejsikora/node-express-babel-boilerplate .


Das Problem, dass diese Transpilation nur die js-Dateien konvertiert und die Knotenmodule nicht enthält
stackdave

1
Erstellen Sie einen zweiten Build-Befehl wie - "Build-Module": "Babel Node-Module / -d dist /",
Maciej Sikora


6

Sie müssen installieren babel-registerund babel-preset-es2015voreingestellt, welche in babel-registerOptionen verwendet werden , um die Konvertierung ES6in die ES5On-the-Fly-Transpilation zu aktivieren

 npm install babel-register

 npm install babel-preset-es2015

Ihre run.js- Datei:

// require babel-register and set Babel presets options to es2015
require('babel-register')({
   presets: [ 'es2015' ]
});

require("./app.js6");

Hinweis : Jetzt benötigen Sie keine .babelrcDatei mehr, um Babel presetsOptionen festzulegen, da wir sie mit der requireMethode festlegen


1
Es gibt einige Warnungen bezüglich der Verwendung in der Produktion. Babeljs.io/docs/setup/#installation Nicht für die Verwendung in der Produktion vorgesehen. Der erforderliche Haken wird hauptsächlich für einfache Fälle empfohlen.
WitVault

Wie kann ich in diesem Fall meine App in der Produktion ausführen? Muss ich meine Dateien auf es5 kompilieren? : /
Sandiprb

@sandip_rb Ja, Sie müssen Ihre Dateien kompilieren, bevor Sie zur Produktion gehen. Sie müssen herausfinden, dass diese Lösung für node.jsVersionen funktioniert, die nicht unterstützt werden ES6(weniger als 4.x-Versionen). Jetzt node.jsVersionsunterstützung ES6
ahmed hamdy

@ Sandip_rb siehe nützlichen Link über die Verwendung von Babel in der Produktion -> medium.com/@Cuadraman/…
Ahmed Hamdy

6
  1. node -r babel-register scripts.js

Dies ist die beste Lösung

  1. npx babel-node scripts.js

! Babel-Knoten funktioniert im Falle eines Exit-Prozesses nicht gut und kexecPaket hilft auch in diesem Fall nicht (wie ich versucht habe)

In beiden Fällen müssen Sie .babelrcVoreinstellungen und Plugins für Ihre App verwenden.

npxwird nur zur Ausführung von Bibliotheken verwendet, die nicht mit npmoder installiert sind yarn. Ansonsten musst du npm i -g babel-cliund dannbabel-node script.js


Knoten -r Babel-Register scripts.js funktioniert wie Charme und ganz einfach in dev
Nditah

3

Ich würde einen Anruf wie bevorzugen nodejs6 app.js6.

Sie können die Wrapper-Lösung mit Babel-Core-API ausprobieren:

// Save as es6.js

var babel = require("babel-core");
var argc = process.argv.length;

babel.transformFile(process.argv[argc - 1], function (err, result) {
    eval(result.code);
});

Führen Sie Ihr es6-Skript mit aus node es6 thefile.js

Referenz : Dokument zur offiziellen Verwendung


1

Ab Babel 6 müssen Sie nun babel-registerFolgendes installieren und verwenden

require("babel-register");

Stellen Sie sicher, dass Sie auch die Voreinstellung babel es2015 installieren.


Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.