Babel

使用方法

どのような JavaScript リソースファイルでも、 resources.Babel を使って別の JavaScript バージョンにトランスパイルできます。この引数はリソースオブジェクトと、オプションとして以下に挙げるオプションのディクテーションを取ります。 Babel は、 babel cli  を使用します。

設定

Babel や同様のツールを実行する際に、メインプロジェクトの node_modules を NODE_PATH に追加しています。この領域では Babel との間で既知の 問題  があるので、(プロジェクト自体ではなく) Hugo モジュールに babel.config.js を作成している場合は、プリセット/プラグインをロードするために require を使うことをお勧めします。たとえば、以下のように指定します。

module.exports = {
  presets: [
    [
      require("@babel/preset-env"),
      {
        useBuiltIns: "entry",
        corejs: 3,
      },
    ],
  ],
};

オプション

config [string]

Babel 設定ファイルへのパスです。 Hugo はデフォルトで、プロジェクトにある babel.config.js を探します。これらの設定ファイルの詳細については、「Babel 設定」  を参照してください。

minified [bool]

出力時にできるだけ多くのバイトを節約します

noComments [bool]

生成された出力にコメントを書き込みます (デフォルトは true)

compact [bool]

余計な空白文字や行末記号を含めません。設定されていない場合、デフォルトは auto です。

verbose [bool]

すべてをログに記録します

sourceMap [string]

Babel のコンパイルで得られた inline または external のソースマップを出力します。外部ソースマップは、出力ファイル名 + “.map” でターゲットに書き込まれます。入力ソースマップは、js.Build と node モジュールから読み込んで、出力ソースマップに結合できます。

例

{{- $transpiled := resources.Get "scripts/main.js" | babel  -}}

またはオプション付きで、以下のようにします。

{{ $opts := dict "noComments" true }}
{{- $transpiled := resources.Get "scripts/main.js" | babel $opts -}}