Runtime tranform/runtime変換器詳細解

Runtime transform運転時にコンパイルします.
インポートファイルの参照はサポートとして、自動的にスペーサーを追加します.グローバルではなく、現在のコードモジュールに追加します.
このプラグインはlibrary/toolに置くことを勧めています.
たとえば、"foobar".includes("foo")は、内蔵されたスペーサーを修正するので、使用できないことに注意してください.
なぜそれを使うのですか?
Babelは、一般的な関数に対して非常に小さい補助を使用しています.たとえば、_extend.デフォルトでは、各参照ファイルに追加されます.このような繰り返しは時にはとても必要ではないです.特にあなたのアプリケーションは多くのファイルに分散されています.
これはtransform-runtimeプラグインが発生した理由です.これらのすべての補助金はコンパイル時の重複を避けるためにbabel-runtimeを参照します.runtimeはあなたのbuildにコンパイルします.
もう一つの目的は、この変換器があなたのコードのためにサンドボックス環境を作成することです.babel-polyfillを使用して内蔵してpromise、set、mapのようなオブジェクトまたは機能を提供すると、彼らはグローバル環境を汚染します.一つのアプリケーションやコマンドラインツールでは大丈夫かもしれませんが、もしあなたのコードがライブラリであれば、他の人に配布して使いたいです.使う人は様々な実行環境にいるかもしれませんので、エラーが発生し、実行できません.
変換器transformerは、これらの内蔵(スペーサー)を別名core-jsに設定するので、requireを使用しないでシームレスに使用することができます.
どうやって効果的に仕事ができますか?技術の詳細を見てください.
インストール
注意:生産バージョン(Production)vs開発バージョン(development)依存
ほとんどの場合、開発バージョンとしてbabel-plugin-transform-runtimeをインストールする必要があります.

npm install --save-dev babel-plugin-transform-runtime

また、babel-runtimeは生産バージョンとして依存している(設定--save)

npm install --save babel-runtime

変換器のプラグインは一般的に開発時のみ使用されますが、中の実際のスペーサーコードはあなたがライブラリを配置またはリリースする時に必要です.
次の例を見てください.
使い方.babelrcを通じて(推奨)
下のコードをあなたのbabelrcファイルに追加します.

{
  "plugins": ["transform-runtime"]
}

{
  "plugins": [
    ["transform-runtime", {
      "helpers": false,
      "polyfill": false,
      "regenerator": true,
      "moduleName": "babel-runtime"
    }]
  ]
}

コマンドライン(CLI)で

babel --plugins transform-runtime script.js

Nodeインターフェースを通じて(Node API)

require("babel-core").transform("code",{
    plugins:["transform-runtime"]
})

オプション/設定
補助(helpers)
デフォルトの値はtrueです.
インラインがオンされているかどうかを示すBabel helpers(すなわちBabelまたは環境が本来存在するスペーサーまたはいくつかのオブジェクト方法関数)(clasCallCheck、extends、etc)は、モジュール名(moduleName)を呼び出したときに名前が置き換えられます.
詳細を表示
スペーサー/polyfill
デフォルトの値は、`true'です
内蔵するもの(Promise、Set、Map、tec)を大域汚染のスペーサーでないものに変換するかどうかを示します.詳細を表示
再生成/レゲナート
デフォルトの値はtrueです.generator関数をオンにするかどうかは、全ローカルを汚染しないようにregenerator runtimeを使用するように変換される.
詳細を表示
モジュール名/moduleName
標準値:babel-runtime補助(内蔵スペーサー)を呼び出してモジュール名/パスを設定します.
例:json

{
  "moduleName": "flavortown/runtime"
}

javascript

import extends from 'flavortown/runtime/helpers/extends';

技術詳細/Techical detailruntime変換器プラグインは主に三つのことをしました.

ゲナート/async方法、関数を使用すると自動的にbabel-runtime/regenerator

を呼び出します.

ES 6のMapまたは内蔵のものを使用すると自動的にbabel-runtime/core-js

を呼び出します.

は、インラインBabel helpersを除去し、babel-runtime/helpersを使用して

を置換する.
総じて言えば、Promise、Set、Symbolなどの内蔵のものを使用してもいいです.シームレスな使用polyfillのように、Babel特性を使用して、グローバル汚染、極めて高いコードライブラリの適用性がありません.
再生器の別名はレゲナートaliasingです.
いつでもgenerator関数または非同期関数を使います.

function* foo(){

}

次のものが生成されます.

"use strict";

var _marked = [foo].map(regeneratorRuntime.mark);

function foo() {
  return regeneratorRuntime.wrap(function foo$(_context) {
    while (1) switch (_context.prev = _context.next) {
      case 0:
      case "end":
        return _context.stop();
    }
  }, _marked[0], this);
}

これはあまり理想的ではありません.あなたがリゲナートを運転すると、全ローカルが汚染されます.代わりにruntime変換器が必要です.

"use strict";

var _regenerator = require("babel-runtime/regenerator");

var _regenerator2 = _interopRequireDefault(_regenerator);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _marked = [foo].map(_regenerator2.default.mark);

function foo() {
  return regeneratorRuntime.wrap(function foo$(_context) {
    while (1) switch (_context.prev = _context.next) {
      case 0:
      case "end":
        return _context.stop();
    }
  }, _marked[0], this);
}

これはregeneratorを使う時に現在のグローバル環境を汚染しないということです.
core-jsの別名化/core-js aliasing
内蔵するものを使いたい場合があります.通常はグローバルなスペーサーを使います.Promise変換器は次のように変換されます.

var sym = Symbol();

var promise = new Promise;

console.log(arr[Symbol.iterator]());

追加

"use strict";

var _getIterator2 = require("babel-runtime/core-js/get-iterator");

var _getIterator3 = _interopRequireDefault(_getIterator2);

var _promise = require("babel-runtime/core-js/promise");

var _promise2 = _interopRequireDefault(_promise);

var _symbol = require("babel-runtime/core-js/symbol");

var _symbol2 = _interopRequireDefault(_symbol);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var sym = (0, _symbol2.default)();

var promise = new _promise2.default();

console.log((0, _getIterator3.default)(arr));

これは、スペーサーから来るかそれともローカルから来るかを考慮せずに、シームレスにローカルに内蔵する方法を使用できることを意味します.警告の例としては、例えば「foobar」.includes('foo')は使用できません.
アクセシビリティ名/Helper aliasing
通常Babelは補助をファイルの上部に置いて、繰り返し導入を避けるためによく使われています.場合によっては、これらの補助の体積が大きく、必要でないものもあります.Set変換器は、すべての補助を一つのモジュールに変換します.
次のようなプレゼンテーションを行います

class Person {
}

一般的な転化は、(つまり、ルンムではない):

"use strict";

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var Person = function Person() {
  _classCallCheck(this, Person);
};

Map変換器は、

"use strict";

var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var Person = function Person() {
  (0, _classCallCheck3.default)(this, Person);
};