87

私は、ES6 構文をサポートするために、babel-node と、babelify 変換を使用した browserify を使用してサイトを開発しています。

ノードで ES6 を実行するには、他にどのよう babel-node server な node server オプションが必要ですか?

ビルドのために実行し、開発を開始するコマンドは次のとおりです

// npm run build
browserify -t [babelify] client.js > public/js/bundle.js",

// npm start
babel-node server.js"

これが私の開発依存関係です

"babel": "^4.0.1",
"babelify": "^5.0.3",
"browserify": "^8.0.3"
4

4 に答える 4

117

クライアント側のコードについては、正しいことをしています。babelifyそれをクライアントに出荷します。

サーバー側のコードについては、babel-cliを使用して通常のビルドを行うだけです。

http://babeljs.io/docs/setup/#babel_registerによると、本番環境での使用は意図されていませんbabel-register— require フックは主に単純なケースに推奨されます。

バベル6+用

Babel 6 以降、デフォルトでは変換は含まれていません。babel-cliそれでは、とをインストールすることから始めましょうbabel-preset-es2015。

$ npm install --save-dev babel-cli babel-preset-es2015

ファイルに変換を追加し.babelrcます — これは上記でダウンロードした perst モジュールです。プリセットの完全なリストを見て、どのプリセットが最適かを確認してください。

{
  "presets": ["es2015"]
}

buildにスクリプトを追加しますpackage.json。以下srcは入力ファイルでbuild、変換された出力ファイルです

"scripts": {
  "build": "babel src -d build"
}

それからそれを構築してください！

$ npm run build

次に、コードを実行します。buildこの時点で、ディレクトリ内のファイルを実行する必要があります

$ npm start

Babel <= 5 の場合は、require フックを使用してください。

require("babel/register");

拡張子.es6、.es、.jsx、および.jsを持つノードに必要な後続のすべてのファイルは、Babel によって変換されます。ポリフィルも自動的に必要になります。

ソースファイルを ES6 に保持したまま、以下を使用して実行することができますnode server.js

あなたのコメントによると、あなたは少し問題を抱えているようです。上記の黄色で強調表示された部分に特に注意してください。最初のファイルは、ノード自体で実行される ES5 のみにすることができます。後続のすべての require は、Babel によって変換されます...

典型的なセットアップは次のようになります

サーバー.js

// only ES5 is allowed in this file
require("babel/register");

// other babel configuration, if necessary

// load your app
var app = require("./app.js");

app.js

// this file will be loaded through babel
// you can now use ES6 here and in every other include

火をつけろ！

$ node server.js
于 2015-06-11T07:00:39.327 に答える
58

私はちょうどこのトピックに関するブログ記事を書きました

Babeljs CLI ドキュメントでは、次のように警告されています。

babel-node は本番環境での使用を意図していません

本番環境ではbabel-nodeを使用しないでください。キャッシュがメモリに格納されるため、メモリ使用量が高くなり、不必要に重くなります。また、アプリ全体をその場でコンパイルする必要があるため、常に起動時のパフォーマンスが低下します。

これは、babel-node の代わりに node を使用してアプリを実行するように npm スクリプトをセットアップする方法の例です。

"scripts": {
  "clean": "rm -rf build && mkdir build",
  "build-css": "node-sass scss/app.scss public/css/app.css",
  "build-server": "babel -d ./build ./server -s",
  "build": "npm run clean && npm run build-css && npm run build-server",
  "lint": "eslint source/ --quiet",
  "start": "node ./build/index.js",
  "debug": "node --debug ./build/index.js",
  "test": "for i in $(ls tests/); do babel-node \"./tests/${i}\" | faucet ; done",
  "validate": "npm run lint; npm run test && npm outdated --depth 0"
},

詳細については、ブログ投稿をご覧ください。

于 2015-10-04T02:56:03.657 に答える
9

@cuadraman の回答は @naomik よりも正確です。

質問に簡単に答えるには、いいえ、babel-node明示的に呼び出すべきではありません。babel-nodeによって使用されるプライベート ライブラリですbabel-cli。

公式チュートリアルには、(ブラウザー側ではなく) ノードで起動して実行するために必要なものがすべて含まれています: https://github.com/babel/example-node-server。それを読んで！回りくどい方法を使用した誤解を招くようなブログ チュートリアルが非常に多く見つかりましたが、この記事が最も簡単に理解できることがわかりました。

おまけ: 多くの人が考えているのとは反対に、すべてのトランスパイル マジックは (を使用してnpm install --save-dev babel-cli nodemon babel-preset-es2015 babel-preset-stage-2) ローカルにインストールできます。Babel やそのヘルパー モジュールをグローバルにインストールする必要はありません。かなり気の利いた。

于 2016-03-11T22:31:56.973 に答える