メインコンテンツにスキップ

オプション

オプションはさまざまな方法でBabelに渡すことができます。Babelに直接渡す場合は、オプションオブジェクトを渡すだけです。Babelがラッパー経由で使用されている場合は、設定ファイル経由でオプションを渡すことが必要になるか、少なくともより便利になる可能性があります。

@babel/cli経由でオプションを渡す場合は、名前をkebab-caseにする必要があります。すなわち、

npx babel --root-mode upward file.js # equivalent of passing the rootMode config option

主要なオプション

これらのオプションは、Babelのプログラムによるオプションの一部としてのみ許可されているため、主にBabelをラップするツールや、babel.transformを直接呼び出す人が使用します。babel-loader@babel/registerのようなBabelの統合を使用しているユーザーは、これらを使用する可能性は低いでしょう。

cwd

型: string
デフォルト: process.cwd()

プログラムによるオプション内のすべてのパスが相対的に解決される作業ディレクトリ。

caller

型: 次の形状のオブジェクト

interface CallerData {
name: string;
supportsStaticESM?: boolean;
supportsDynamicImport?: boolean;
supportsTopLevelAwait?: boolean;
supportsExportNamespaceFrom?: boolean;
}
履歴
バージョン変更点
v7.11.0supportsExportNamespaceFromを追加
v7.7.0supportsTopLevelAwaitを追加
v7.5.0supportsDynamicImportを追加

ユーティリティは、Babelに自身を識別し、設定、プリセット、プラグインで使用するための機能関連フラグを渡すために、callerオブジェクトを渡す場合があります。たとえば、

JavaScript
babel.transformFileSync("example.js", {
caller: {
name: "my-custom-tool",
supportsStaticESM: true,
},
});

これにより、プラグインとプリセットは、ESモジュールがサポートされているため、ESモジュールからCommonJSモジュールへのコンパイルをスキップすると判断できます。

filename

型: string

現在コンパイル中のコードに関連付けられたファイル名(存在する場合)。ファイル名はオプションですが、ファイル名が不明な場合はBabelの一部の機能が利用できないため、一部のオプションはファイル名に依存しています。

ユーザーが遭遇する可能性のある3つの主なケースは次のとおりです。

  • ファイル名はプラグインに公開されます。一部のプラグインはファイル名の存在を必要とする場合があります。
  • "test""exclude"、および"ignore"のようなオプションは、文字列/正規表現マッチングにファイル名を必要とします。
  • .babelrc.jsonまたは.babelrcファイルは、コンパイルされるファイルに対して相対的にロードされます。このオプションが省略された場合、Babelはbabelrc: falseが設定されているかのように動作します。

filenameRelative

型: string
デフォルト: path.relative(opts.cwd, opts.filename) ("filename"が渡された場合)

BabelのsourceFileNameオプションのデフォルト値として使用され、AMD / UMD / SystemJSモジュールの変換のためのファイル名生成の一部として使用されます。

code

型: boolean
デフォルト: true

Babelのデフォルトの戻り値には、生成されたコードを含むcodeプロパティとmapプロパティが含まれています。Babelへの複数の呼び出しが行われる一部のコンテキストでは、コード生成を無効にし、代わりにast: trueを使用してASTを直接取得して、不必要な作業を回避すると便利です。

ast

型: boolean
デフォルト: false

Babelのデフォルトは文字列とソースマップを生成することですが、一部のコンテキストではAST自体を取得すると便利な場合があります。これの主なユースケースは、次のような複数の変換パスの連鎖になります。

JavaScript
const filename = "example.js";
const source = fs.readFileSync(filename, "utf8");

// Load and compile file normally, but skip code generation.
const { ast } = babel.transformSync(source, {
filename,
ast: true,
code: false,
});

// Minify the file in a second pass and generate the output code here.
const { code, map } = babel.transformFromAstSync(ast, source, {
filename,
presets: ["minify"],
babelrc: false,
configFile: false,
});

注: このオプションは、ほとんどのユーザーがそれを必要としないことと、Babelにキャッシュレイヤーを追加したいと考えているため、デフォルトではオンになっていません。AST構造をキャッシュする必要がある場合、より多くのスペースが必要になります。

cloneInputAst

型: boolean
デフォルト: true
v7.11.0で追加

デフォルトでは、babel.transformFromAstは入力ASTを複製して、変更を回避します。入力ASTが他の場所で使用されていない場合は、cloneInputAst: falseを指定すると、解析パフォーマンスが向上する可能性があります。

設定読み込みオプション

環境にはいくつかのタイプの構成ファイルがあり、それらの構成ファイルには構成に応じて適用されるさまざまなネストされた構成オブジェクトがあるため、構成の読み込みは少し複雑になる可能性があります。

root

型: string
デフォルト: opts.cwd
配置: Babelのプログラムによるオプションでのみ許可されます

"rootMode"に基づいて処理される初期パスで、現在のBabelプロジェクトの概念的なルートフォルダを決定します。これは、主に2つのケースで使用されます。

  • デフォルトの"configFile"値をチェックするときのベースディレクトリ
  • "babelrcRoots"のデフォルト値。

rootMode

型: "root" | "upward" | "upward-optional"
デフォルト: "root"
配置: Babelのプログラムによるオプションでのみ許可されます
追加: v7.1.0

このオプションは、"root"値と組み合わせて、Babelがプロジェクトルートを選択する方法を定義します。さまざまなモードは、Babelが"root"値を処理して最終的なプロジェクトルートを取得するためのさまざまな方法を定義します。

注: babel.config.jsonはBabel 7.8.0からサポートされています。古いBabel 7バージョンでは、babel.config.jsのみがサポートされています。

  • "root" - "root"値を変更せずに渡します。
  • "upward" - "root"ディレクトリから上に移動し、babel.config.jsonファイルを含むディレクトリを探し、babel.config.jsonが見つからない場合はエラーをスローします。
  • "upward-optional" - "root"ディレクトリから上に移動し、babel.config.jsonファイルを含むディレクトリを探し、babel.config.jsonが見つからない場合は"root"に戻ります。

"root"がデフォルトモードであるのは、Babelが現在のプロジェクトフォルダの完全に外にあるbabel.config.jsonを誤ってロードするリスクを回避するためです。"upward-optional"を使用する場合は、ディレクトリ構造をファイルシステムのルートまで上に移動し、誰かがホームディレクトリに忘れたbabel.config.jsonを持っている可能性があり、それがビルドで予期しないエラーを引き起こす可能性があることに注意してください。

パッケージごとにビルド/テストを実行するモノレポプロジェクト構造を持つユーザーは、モノレポはプロジェクトルートにbabel.config.jsonを持っていることが多いため、"upward"を使用することを検討するかもしれません。"upward"なしでモノレポサブディレクトリでBabelを実行すると、Babelはプロジェクトルートにあるbabel.config.jsonファイルのロードをスキップし、予期しないエラーやコンパイルの失敗につながる可能性があります。

envName

型: string
デフォルト: process.env.BABEL_ENV || process.env.NODE_ENV || "development"
配置: Babelのプログラムによるオプションでのみ許可されます

設定の読み込み中に使用される現在のアクティブな環境。この値は、"env"設定を解決する際のキーとして使用され、api.env()関数を介して、設定関数、プラグイン、およびプリセット内でも使用できます。

configFile

型: string | boolean
デフォルト: デフォルトのbabel.config.jsonファイルが存在する場合はpath.resolve(opts.root, "babel.config.json")、それ以外の場合はfalse
配置: Babelのプログラムによるオプションでのみ許可されます

デフォルトではデフォルトのbabel.config.jsonファイルを探しますが、任意のJSまたはJSON5設定ファイルのパスを渡すことができます。

注意:このオプションは、.babelrc.jsonファイルの読み込みには影響を及ぼしません。そのため、configFile: "./foo/.babelrc.json"のように指定したくなるかもしれませんが、推奨されません。もし指定された.babelrc.jsonが標準のファイル相対ロジックで読み込まれた場合、同じ設定ファイルが2回読み込まれ、それ自身とマージされることになります。特定の設定ファイルをリンクする場合は、「babelrc」という名前とは独立した命名規則に従うことをお勧めします。

babelrc

型: boolean
デフォルト値: filenameオプションが指定されている場合はtrue
設定箇所: Babelのプログラムオプション、またはロードされた"configFile"内で許可されます。プログラムオプションは、設定ファイルの設定を上書きします。

trueの場合、Babelに提供された"filename"を基準とした設定ファイルと、従来の.babelignoreファイルの検索が有効になります。

プログラムオプションで渡されたbabelrcの値は、設定ファイル内で設定された値を上書きします。

注意:.babelrc.jsonファイルは、現在の"filename"が、"babelrcRoots"パッケージのいずれかに一致するパッケージ内にある場合にのみロードされます。

babelrcRoots

型: boolean | MatchPattern | Array<MatchPattern>
デフォルト値: opts.root
設定箇所: Babelのプログラムオプション、またはロードされたconfigFile内で許可されます。プログラムオプションは、設定ファイルの設定を上書きします。

デフォルトでは、Babelは"root"パッケージ内でのみ.babelrc.jsonファイルを検索します。これは、そうしないとBabelは特定の.babelrc.jsonがロードされるべきか、また、コンパイルされるファイルがnode_modules内にあるか、プロジェクトにシンボリックリンクされている可能性があるため、"plugins""presets"がインストールされているかどうかを知ることができないためです。

このオプションを使用すると、ユーザーは、.babelrc.jsonファイルをロードするかどうかを検討する際に「root」パッケージと見なすべき他のパッケージのリストを提供できます。

たとえば、個々のパッケージが独自の設定を持つことを許可したいモノレポのセットアップでは、次のように設定できます。

JavaScript
babelrcRoots: [
// Keep the root as a root
".",

// Also consider monorepo packages "root" and load their .babelrc.json files.
"./packages/*",
];

プラグインとプリセットのオプション

plugins

型: Array<PluginEntry | Plugin> (PluginEntry)
デフォルト値: []

このファイルの処理時にアクティブにするプラグインの配列。特に、複数のネストされた"env"および"overrides"設定で使用した場合に、個々のエントリがどのように相互作用するかについての詳細は、マージを参照してください。

注意:このオプションでは、Babel自体からのPluginインスタンスも許可されていますが、これらを直接使用することはお勧めしません。プラグインまたはプリセットの永続的な表現を作成する必要がある場合は、babel.createConfigItem()を使用する必要があります。

presets

型: Array<PresetEntry> (PresetEntry)
デフォルト値: []

このファイルの処理時にアクティブにするプリセットの配列。特に、複数のネストされた"env"および"overrides"設定で使用した場合に、個々のエントリがどのように相互作用するかについての詳細は、マージを参照してください。

注意:プリセットの形式はプラグインと同一ですが、名前の正規化では「plugin-」の代わりに「preset-」が期待され、プリセットはPluginのインスタンスにはなれないという点が異なります。

passPerPreset

型: boolean
デフォルト: false
ステータス: 非推奨

presets配列内の各プリセットを独立したパスとして実行するようにBabelに指示します。このオプションは、プラグインの正確な順序に関する多くの混乱を引き起こす傾向がありますが、一連の操作を独立したコンパイルパスとして実行する必要がある場合に役立つことがあります。

注意:このオプションは、プラグイン間の順序定義のサポートを改善するにあたり、将来のBabelバージョンで削除される可能性があります。

出力ターゲット

targets

型: string | Array<string> | { [string]: string }
デフォルト値: {}
設定箇所: Babelのプログラムオプションまたは設定ファイルで許可されます
追加: v7.13.0

履歴
バージョン変更点
v7.20.0denoターゲットをサポート
v7.15.0rhinoターゲットをサポート

プロジェクトでサポート/ターゲットとする環境を記述します。

これは、browserslist互換のクエリ(注意点あり)でも構いません。

babel.config.json
{
"targets": "> 0.25%, not dead"
}

または、サポートする最小環境バージョンのオブジェクトでも構いません。

babel.config.json
{
"targets": {
"chrome": "58",
"ie": "11"
}
}

サポートされる環境: android, chrome, deno, edge, electron, firefox, ie, ios, node, opera, rhino, safari, samsung

マイナーバージョンが指定されていない場合、BabelはMAJOR.0として解釈します。たとえば、"node": 12はNode.js 12.0として考慮されます。

ターゲットなし

ターゲットが指定されていない場合:Babelは可能な限り古いブラウザをターゲットにしていると想定します。たとえば、@babel/preset-envはすべてのES2015-ES2020コードをES5互換になるように変換します。

ヒント

出力コードのサイズを小さくするために、targetsを設定することをお勧めします。

babel.config.json
{
"presets": ["@babel/preset-env"]
}

このため、Babelの動作はbrowserslistとは異なります。Babelまたはbrowserslist設定でターゲットが見つからない場合、defaultsクエリを使用しませんdefaultsクエリを使用したい場合は、ターゲットとして明示的に渡す必要があります。

babel.config.json
{
"targets": "defaults"
}

これが理想的ではないことを認識しており、Babel v8で再検討します。

:::

targets.esmodules

型: boolean

ES Modulesをサポートするブラウザをターゲットにすることもできます。esmodulesターゲットが指定されると、browsersターゲットおよびbrowserslistのターゲットと共通部分が計算されます。このアプローチを<script type="module"></script>と組み合わせて使用すると、より小さなスクリプトをユーザーに条件付きで配信できます(https://jakearchibald.com/2017/es-modules-in-browsers/#nomodule-for-backwards-compatibility)。

browsersとesmodulesターゲットの両方を指定すると、それらの共通部分が計算されます。
babel.config.json
{
"targets": {
"esmodules": true
}
}

targets.node

型: string | "current" | true

現在のNodeバージョンに対してコンパイルする場合は、"node": trueまたは"node": "current"を指定できます。これは"node": process.versions.nodeと同じになります。

あるいは、browserslistクエリでNodeバージョンを指定することもできます。

babel.config.json
{
"targets": "node 12" // not recommended
}

この場合、browserslistはnode-releasesライブラリで利用可能な*最新*バージョンに解決します。Node.jsはマイナーリリースで新しい言語機能をサポートする可能性があるため、Node.js 12.22用に生成されたプログラムはNode.js 12.0で構文エラーをスローする可能性があります。browserslistでnodeクエリを使用する場合は、常にマイナーバージョンを指定することをお勧めします。

babel.config.json
{
"targets": "node 12.0"
}

targets.safari

型: string | "tp"

Safariのテクノロジープレビューバージョンに対してコンパイルする場合は、"safari": "tp"を指定できます。

targets.browsers

型: string | Array<string>

browserslistを使用してブラウザを選択するクエリ(例:last 2 versions, > 5%, safari tp)。

注意:ブラウザの結果は、targetsからの明示的な項目によって上書きされます。

targets.deno

型: string

サポートされる最小バージョンは1.0です。

babel.config.json
{
"targets": {
"deno": "1.9"
}
}

browserslistConfigFile

型: boolean
デフォルト: true
設定箇所: Babelのプログラムオプションまたは設定ファイルで許可されます
追加: v7.13.0

browserslist設定ソース(package.json内のbrowserslistキーの検索や参照を含む)を使用するかどうかを切り替えます。これは、Babelでコンパイルされないファイルにbrowserslist設定を使用するプロジェクトに役立ちます。

文字列が指定された場合、browserslist設定ファイルのパスを表す必要があります。相対パスは、このオプションを指定する設定ファイル、またはプログラムオプションの一部として渡された場合はcwdを基準に解決されます。

browserslistEnv

型: string
デフォルト値: undefined
設定箇所: Babelのプログラムオプションまたは設定ファイルで許可されます
追加: v7.13.0

使用するBrowserslist 環境

設定のマージオプション

extends

型: string
配置場所: プリセット内では使用できません

設定は他の設定ファイルを「拡張」できます。現在の設定のフィールドは、拡張されたファイルの設定の上にマージされます。

env

型: { [envKey: string]: Options }
配置場所: 別のenvブロック内にはネストできません。

envKeyenvNameオプションと一致する場合にのみ有効になる、ネストされた設定オプション全体を許可します。

注意: env[envKey]オプションは、ルートオブジェクトで指定されたオプションの上にマージされます。

overrides

型: Array<Options>
配置場所: 別のoverridesオブジェクト内、またはenvブロック内にはネストできません。

現在の設定に1つずつマージされるオプションの配列をユーザーが提供できるようにします。この機能は、オーバーライドを適用する条件を指定するために、"test"/"include"/"exclude"オプションと組み合わせて使用するのが最適です。例えば、

JavaScript
overrides: [{
test: "./vendor/large.min.js",
compact: true,
}],

サイズが大きくminifyされていることがわかっている特定のファイルに対してcompactオプションを有効にし、Babelにファイルをきれいに表示しようとしないように指示するために使用できます。

test

型: MatchPattern | Array<MatchPattern> (MatchPattern)

すべてのパターンが一致に失敗した場合、現在の設定オブジェクトは非アクティブと見なされ、設定処理中に無視されます。このオプションは、overridesオプションオブジェクト内で使用するのが最も便利ですが、どこでも使用できます。

注意: これらの切り替えは、マージの準備が整った構成よりもずっと前に考慮されるため、前のセクションのプログラムによるオプションと構成読み込みオプションには影響しません。

include

型: MatchPattern | Array<MatchPattern> (MatchPattern)

このオプションは、"test"の同義語です。

exclude

型: MatchPattern | Array<MatchPattern> (MatchPattern)

いずれかのパターンが一致した場合、現在の設定オブジェクトは非アクティブと見なされ、設定処理中に無視されます。このオプションは、overridesオプションオブジェクト内で使用するのが最も便利ですが、どこでも使用できます。

注意: これらの切り替えは、マージの準備が整った構成よりもずっと前に考慮されるため、前のセクションのプログラムによるオプションと構成読み込みオプションには影響しません。

ignore

型: Array<MatchPattern> (MatchPattern)
配置場所: プリセット内では使用できません

いずれかのパターンが一致した場合、Babelは現在のビルドのすべての処理を直ちに停止します。例えば、ユーザーは次のようなことをしたいかもしれません。

JavaScript
ignore: ["./lib"];

libディレクトリ内のファイルのBabelコンパイルを明示的に無効にする。

注意: このオプションは、ファイルのすべてのBabel処理を無効にします。それには用途がありますが、積極性の低い代替手段として"exclude"オプションを検討する価値もあります。

only

型: Array<MatchPattern> (MatchPattern)
配置場所: プリセット内では使用できません

すべてのパターンが一致に失敗した場合、Babelは現在のビルドのすべての処理を直ちに停止します。例えば、ユーザーは次のようなことをしたいかもしれません。

JavaScript
only: ["./src"];

srcディレクトリ内のファイルのBabelコンパイルを明示的に有効にし、その他すべてを無効にする。

注意: このオプションは、ファイルのすべてのBabel処理を無効にします。それには用途がありますが、積極性の低い代替手段として"test"/"include"オプションを検討する価値もあります。

ソースマップオプション

inputSourceMap

型: boolean | SourceMap
デフォルト: true

trueは、ファイル自体に//# sourceMappingURL=...コメントが含まれている場合、入力ソースマップをロードしようとします。マップが見つからない場合、またはマップのロードと解析に失敗した場合、マップは黙って破棄されます。

オブジェクトが指定された場合、それはソースマップオブジェクト自体として扱われます。

sourceMaps

型: boolean | "inline" | "both"
デフォルト: false

  • trueは、コードのソースマップを生成し、結果オブジェクトに含めます。
  • "inline"は、ソースマップを生成し、データURLとしてコードの末尾に追加しますが、結果オブジェクトには含めません。
  • "both"はインラインと同じですが、結果オブジェクトにマップを含めます。

@babel/cliは、これらのいくつかをオーバーロードして、マップがディスクにどのように書き込まれるかにも影響を与えます。

  • trueは、マップをディスク上の.mapファイルに書き込みます。
  • "inline"はファイルを直接書き込むため、マップを含むdata:が含まれます。
  • "both"は、data: URLとさらに.mapを使用してファイルを書き込みます。

注意: これらのオプションは少し奇妙なので、ユースケースによっては、単にtrueを使用し、残りを独自のコードで処理するのが最も理にかなっている場合があります。

sourceMap

これはsourceMapsの同義語です。sourceMapsの使用をお勧めします。

sourceFileName

型: string
デフォルト: 利用可能な場合はpath.basename(opts.filenameRelative)、それ以外の場合は"unknown"

ソースマップオブジェクト内でファイルに使用する名前。

sourceRoot

型: string

生成されたソースマップに設定するsourceRootフィールド(必要な場合)。

その他のオプション

sourceType

型: "script" | "module" | "unambiguous"
デフォルト: "module"

  • "script" - ECMAScriptスクリプト文法を使用してファイルを解析します。import/exportステートメントは許可されておらず、ファイルはstrictモードではありません。
  • "module" - ECMAScriptモジュール文法を使用してファイルを解析します。ファイルは自動的にstrictモードになり、import/exportステートメントが許可されます。
  • "unambiguous" - import/exportステートメントが存在する場合はファイルを「モジュール」とみなし、それ以外の場合は「スクリプト」とみなします。

unambiguousは、型が不明なコンテキストで非常に役立つ場合がありますが、import/exportステートメントを使用しないモジュールファイルを持つことは完全に有効であるため、誤った一致につながる可能性があります。

現在のファイルの型は、入力ファイルの解析と、現在のファイルにimport/requireの使用を追加する可能性のある特定の変換の両方に影響するため、このオプションは重要です。

例えば、@babel/plugin-transform-runtimeは、import宣言を挿入するかrequire()呼び出しを挿入するかを決定するために、現在のドキュメントの型に依存しています。@babel/preset-envも、その"useBuiltIns"オプションに対して同じことを行います。BabelはデフォルトでファイルをESモジュールとして扱うため、一般的にこれらのプラグイン/プリセットはimportステートメントを挿入します。sourceTypeを正しく設定することは重要です。タイプが間違っていると、BabelがCommonJSファイルであるはずのファイルにimportステートメントを挿入するケースが発生する可能性があるためです。これは、node_modules依存関係のコンパイルが実行されているプロジェクトでは特に重要です。importステートメントを挿入すると、WebpackなどのツールがファイルをESモジュールと見なし、機能していたはずのCommonJSファイルが壊れる可能性があるためです。

注意: このオプションは、.mjsファイルの解析には影響しません。これらのファイルは現在、常に"module"ファイルとして解析されるようにハードコードされています。

assumptions

型: { [assumption: string]: boolean }
デフォルト値: {}
追加: v7.13.0
配置場所: プログラムによるオプション、設定ファイル、およびプリセットで許可されています。

Babelがより小さな出力を作成するために行える仮定を設定します。

babel.config.json
{
"assumptions": {
"iterableIsArray": true
},
"presets": ["@babel/preset-env"]
}

詳細については、仮定のドキュメントページを確認してください。

highlightCode

型: boolean
デフォルト: true

Babelのエラーメッセージのコードスニペットでトークンを強調表示して、読みやすくします。

wrapPluginVisitorMethod

型: (key: string, nodeType: string, fn: Function) => Function

ユーザーが各ビジターにラッパーを追加して、Babelがプラグインを実行するときにビジタープロセスを検査できるようにします。

  • keyは、実行されているプラグインを表す単純な不透明な文字列です。
  • nodeTypeは、現在訪問されているASTノードのタイプです。
  • fnは、ビジター関数自体です。

ユーザーは、ログや分析を実行した後、元の関数を呼び出す必要がある置換関数を返すことができます。

parserOpts

型: {}

使用されるパーサーに渡すオプションを含む不透明なオブジェクト。

利用可能なパーサーオプションについては、パーサーオプションを参照してください。

generatorOpts

型: {}

使用されるコードジェネレーターに渡すオプションを含む不透明なオブジェクト。最もよく使用されるオプションについては、コードジェネレーターオプションを参照してください。

コードジェネレーターオプション

retainLines

型: boolean
デフォルト: false

Babelは、アイテムが元のファイルにあった行と同じ行に出力されるように、コードを生成する努力をします。このオプションは、ソースマップを使用できないユーザーが、やや便利なエラー行番号を取得できるようにするために存在しますが、最善の努力のみであり、すべてのプラグインですべての場合に保証されるものではありません。

compact

型: boolean | "auto"
デフォルト: "auto"

"auto"は、code.length > 500_000を評価して値を設定します

コンパクトモードでコードを生成する場合、すべてのオプションの改行と空白は省略されます。

minified

型: boolean
デフォルト: false

compact: trueが含まれ、ブロック終了のセミコロンが省略され、可能な場合はnew Foo()から()が省略され、リテラルの短いバージョンが出力される場合があります。

auxiliaryCommentBefore

型: string

元のファイルに存在しなかったコードの前に挿入するプレフィックスコメントを指定できます。

注意: 元のファイルに存在するものと存在しないものの定義は少し曖昧になる可能性があるため、このオプションの使用はお勧めしません。何らかの方法でコードに注釈を付ける必要がある場合は、Babelプラグインを使用して行うのがより良い方法です。

auxiliaryCommentAfter

型: string

元のファイルに存在しなかったコードの断片の後に挿入するプレフィックスコメントを指定できます。

注意: 元のファイルに存在するものと存在しないものの定義は少し曖昧になる可能性があるため、このオプションの使用はお勧めしません。何らかの方法でコードに注釈を付ける必要がある場合は、Babelプラグインを使用して行うのがより良い方法です。

comments

型: boolean
デフォルト: true

関数が指定されていない場合、shouldPrintComment のデフォルトのコメント状態を提供します。詳細については、そのオプションのデフォルト値をご覧ください。

shouldPrintComment

型: (value: string) => boolean
minified なしの場合のデフォルト: (val) => opts.comments || /@license|@preserve/.test(val)
minified ありの場合のデフォルト: () => opts.comments

指定されたコメントを Babel からの出力コードに含めるかどうかを決定できる関数。

高度な使用法

その他のコードジェネレーターオプションについては、ジェネレーターオプションをご覧ください。

AMD / UMD / SystemJS モジュールオプション

moduleIds

型: boolean
デフォルト: !!opts.moduleId

モジュール ID の生成を有効にします。

moduleId

型: string

モジュールに使用するハードコードされた ID。getModuleId と一緒に使用することはできません。

getModuleId

型: (name: string) => string

Babel が生成したモジュール名が与えられた場合、使用する名前を返します。偽の値を返すと、元の name が使用されます。

moduleRoot

型: string

生成されたモジュール名に含めるルートパス。

オプションの概念

MatchPattern

型: string | RegExp | (filename: string | void, context: { caller: { name: string } | void, envName: string, dirname: string ) => boolean

いくつかの Babel オプションは、ファイルパスに対してテストを実行します。一般的に、これらのオプションは、各パターンが次のいずれかになる共通のパターンアプローチをサポートしています。

  • string - 完全なスラグ一致として * および ** を簡単にサポートするファイルパス。パターンに一致するファイルまたは親フォルダーはすべて一致と見なされます。パスは Node の通常のパスロジックに従うため、POSIX では / で区切る必要がありますが、Windows では /\ の両方がサポートされます。
  • RegExp - 正規化されたファイル名に対して一致する正規表現。POSIX では、パスの正規表現は / で区切られたパスに対して実行され、Windows では \ で区切られたパスに対して実行されます。

重要なことに、これらのいずれかを使用する場合、Babel では filename オプションが存在する必要があり、そうでない場合はエラーと見なされます。

  • (filename: string | void, context: { caller: { name: string } | void, envName: string, dirname: string }) => boolean は、一致するかどうかを示すブール値を返す必要がある一般的なコールバックです。この関数には、ファイル名、または Babel にファイル名が指定されていない場合は undefined が渡されます。また、Babel の最上位の呼び出しで指定された現在の envName および caller オプションと、構成ファイルのディレクトリまたは現在の作業ディレクトリ (変換がプログラムで呼び出された場合) のいずれかである dirname も渡されます。

マージ

Babel が構成項目をマージする方法を参照してください。

プラグイン/プリセット エントリ

PluginEntry / PresetEntry

個々のプラグイン/プリセット項目には、いくつかの異なる構造を持たせることができます。

  • EntryTarget - 個々のプラグイン
  • [EntryTarget, EntryOptions] - オプション付きの個々のプラグイン
  • [EntryTarget, EntryOptions, string] - オプションと名前付きの個々のプラグイン (名前に関する詳細については、マージを参照してください)
  • ConfigItem - babel.createConfigItem() によって作成されたプラグイン構成項目。

同じ EntryTarget は、それぞれに異なる名前が付けられていない限り、複数回使用できます。そうすると、プラグイン/プリセットの重複エラーが発生します。

これは少し読みにくい可能性があるため、例として示します。

JavaScript
plugins: [
// EntryTarget
'@babel/plugin-transform-classes',

// [EntryTarget, EntryOptions]
['@babel/plugin-transform-arrow-functions', { spec: true }],

// [EntryTarget, EntryOptions, string]
['@babel/plugin-transform-for-of', { loose: true }, "some-name"],

// ConfigItem
babel.createConfigItem(require("@babel/plugin-transform-spread")),
],

EntryTarget

型: string | {} | Function

プラグイン/プリセットのターゲットは、いくつかの異なるソースから取得できます。

  • string - require スタイルのパスまたはプラグイン/プリセット識別子。識別子は 名前の正規化 を介して渡されます。
  • {} | Function - require() された後の実際のプラグイン/プリセットオブジェクトまたは関数。

EntryOptions

型: undefined | {} | false

オプションは、実行時に各プラグイン/プリセットに渡されます。undefined は空のオブジェクトに正規化されます。

false は、エントリが完全に無効であることを示します。これは、順序が重要であるが、何かが有効になっているかどうかを判断するために別の条件が必要なコンテキストで役立ちます。たとえば

JavaScript
plugins: [
'one',
['two', false],
'three',
],
overrides: [{
test: "./src",
plugins: [
'two',
]
}]

は、src 内のファイルに対して two プラグインを有効にしますが、two は依然として onethree の間で実行されます。

名前の正規化

デフォルトでは、Babel はプラグイン名に babel-plugin- または babel-preset- というプレフィックスが付いていることを想定しています。繰り返しを避けるために、Babel には、項目の読み込み時にこれらのプレフィックスを自動的に追加する名前の正規化フェーズがあります。これは、いくつかの主要なルールに要約されます。

  • 絶対パスは変更されません。
  • ./ で始まる相対パスは変更されません。
  • パッケージのファイルへの参照は変更されません。
  • module: というプレフィックスが付いた識別子は、プレフィックスが削除されますが、それ以外は変更されません。
  • plugin-/preset- は、プレフィックスとして持たない @babel スコープのパッケージの先頭に挿入されます。
  • babel-plugin-/babel-preset- は、プレフィックスとして持たないスコープのないパッケージのプレフィックスとして挿入されます。
  • babel-plugin-/babel-preset- は、名前にどこにも持たない @ スコープのパッケージのプレフィックスとして挿入されます。
  • @ スコープ名のみが指定されている場合、babel-plugin/babel-preset はパッケージ名として挿入されます。

プラグインコンテキストに適用する場合の例を次に示します。

入力正規化された
"/dir/plugin.js""/dir/plugin.js"
"./dir/plugin.js""./dir/plugin.js"
"mod""babel-plugin-mod"
"mod/plugin""mod/plugin"
"babel-plugin-mod""babel-plugin-mod"
"@babel/mod""@babel/plugin-mod"
"@babel/plugin-mod""@babel/plugin-mod"
"@babel/mod/plugin""@babel/mod/plugin"
"@scope""@scope/babel-plugin"
"@scope/babel-plugin""@scope/babel-plugin"
"@scope/mod""@scope/babel-plugin-mod"
"@scope/babel-plugin-mod""@scope/babel-plugin-mod"
"@scope/prefix-babel-plugin-mod""@scope/prefix-babel-plugin-mod"
"@scope/mod/plugin""@scope/mod/plugin"
"module:foo""foo"