注意点
ポリフィル
特定の機能を動作させるには、特定のポリフィルが必要です。 core-js/actual
のような完全なポリフィル、または(<script>
タグを使用してロードする場合)core-js-bundle
を使用することで、**すべて**のBabelの機能要件を満たすことができます。
あるいは、必要なものを選択的に含めることもできます。
機能 | 要件 |
---|---|
配列の分割代入、For Of | Symbol 、prototype[Symbol.iterator] |
スプレッド構文 | Array.from |
ジェネレーターまたは非同期関数をES5にコンパイルし、7.18.0
より古いバージョンの@babel/core
または@babel/plugin-transform-regenerator
を使用している場合は、regenerator runtime
パッケージもロードする必要があります。 @babel/preset-env
のuseBuiltIns: "usage"
オプションまたは@babel/plugin-transform-runtime
を使用すると、自動的にロードされます。
組み込み関数
Babelは、組み込み関数(例:Array
、WeakMap
など)がポリフィルされている場合、仕様に準拠した方法で変更されていると想定します。
クラス
Date
、Array
、DOM
などの組み込みクラスは、ES5の制限により、適切にサブクラス化できません(transform-classesプラグインの場合)。 Object.setPrototypeOf
とReflect.construct
に基づくbabel-plugin-transform-builtin-extendを使用することもできますが、これにもいくつかの制限があります。
ES5
BabelはコードがES5環境で実行されると想定しているため、ES5関数を使用します。そのため、IEの古いバージョンなど、ES5のサポートが制限されているか、まったくない環境を使用している場合は、@babel/polyfillを使用することで、これらのメソッドのサポートを追加できます。
Internet Explorer
クラス (10以前)
クラスを継承する場合、静的プロパティは__proto__を介して継承されます。これは広くサポートされていますが、非常に古いブラウザでは問題が発生する可能性があります。
**注意:** __proto__
はIE ≤ 10ではサポートされていないため、静的プロパティは**継承されません**。回避策については、protoToAssignを参照してください。
super
を持つクラスの場合、スーパークラスは正しく解決されません。 transform-classesプラグインで`loose`オプションを有効にすることで、これを回避できます。
ゲッター/セッター (8以前)
IE8では、`Object.defineProperty`はDOMオブジェクトに対してのみ使用できます。これは、ゲッターとセッターを設定するために必要であるため、残念なことです。このため、IE8以前をサポートする予定がある場合は、ゲッターとセッターの使用はお勧めしません。
**参考:** MDN.
モジュール
デフォルトでは、Babelでモジュールを使用する場合、列挙不可能な`__esModule`プロパティがエクスポートされます。これは、IE8以前ではサポートされていない`Object.defineProperty`を使用して行われます。この回避策は、対応するモジュールプラグインで`loose`オプションを有効にすることです。