@babel/plugin-transform-template-literals

資訊

此外掛程式包含於 @babel/preset-env

範例

輸入

JavaScript

`foo${bar}`;

輸出

JavaScript

"foo".concat(bar);

安裝

npm

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

Yarn

yarn add --dev @babel/plugin-transform-template-literals

pnpm

pnpm add --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

Shell

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

透過 Node API

JavaScript

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

選項

loose

布林值，預設為 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;

提示

您可以在 這裡 閱讀更多關於設定外掛選項的資訊