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

@babel/plugin-transform-template-literals

情報

このプラグインは@babel/preset-envに含まれています。

例​

入力

JavaScript
`foo${bar}`;

出力

JavaScript
"foo".concat(bar);

インストール​

npm install --save-dev @babel/plugin-transform-template-literals

使い方​

オプションなし

babel.config.json
{
  "plugins": ["@babel/plugin-transform-template-literals"]
}

オプション付き

babel.config.json
{
  "plugins": [
    [
      "@babel/plugin-transform-template-literals",
      {
        "loose": true
      }
    ]
  ]
}

CLI経由​

シェル
babel --plugins @babel/plugin-transform-template-literals script.js

Node API経由​

JavaScript
require("@babel/core").transformSync("code", {
  plugins: ["@babel/plugin-transform-template-literals"],
});

オプション​

loose​

boolean型で、デフォルトはfalseです。

注意

トップレベルのmutableTemplateObjectアサンプションへの移行を検討してください。

babel.config.json
{
  "assumptions": {
    "mutableTemplateObject": true
  }
}

mutableTemplateObjectがtrueの場合、タグ付きテンプレートリテラルオブジェクトは凍結されません。すべてのテンプレートリテラル式とクォーテーションは、String.prototype.concatではなく、+演算子で結合されます。

falseまたは設定されていない場合、すべてのテンプレートリテラル式とクォーテーションはString.prototype.concatで結合されます。Symbol.toPrimitiveの場合を正しく処理し、テンプレートリテラル式がSymbol()の場合には正しくエラーをスローします。 babel/babel#5791を参照してください。

入力

JavaScript
`foo${bar}`;

出力

JavaScript
"foo" + bar;
ヒント

プラグインオプションの設定について詳しくは、こちらをご覧ください。