跳到主要內容

@babel/plugin-transform-block-scoping

資訊

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

範例​

在

JavaScript
{
  let a = 3;
}

let a = 3;

輸出

JavaScript
{
  var _a = 3;
}

var a = 3;

常數檢查​

此外掛程式也會驗證所有 const 變數。重新指派常數會造成執行時期錯誤，外掛程式會為這些錯誤插入必要的錯誤碼。

安裝​

npm install --save-dev @babel/plugin-transform-block-scoping

用法​

不使用選項

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

使用選項

babel.config.json
{
  "plugins": [
    [
      "@babel/plugin-transform-block-scoping",
      {
        "throwIfClosureRequired": true
      }
    ]
  ]
}

透過 CLI​

Shell
babel --plugins @babel/plugin-transform-block-scoping script.js

透過 Node API​

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

選項​

throwIfClosureRequired​

boolean，預設為 false。

在以下情況中，無法在轉換時重新撰寫 let/const，而不新增其他函式和封閉。

JavaScript
for (let i = 0; i < 5; i++) {
  setTimeout(() => console.log(i), 1);
}

在極度重視效能的程式碼中，這可能是不可取的。如果設定 "throwIfClosureRequired": true，Babel 會在轉換這些模式時擲回例外，而不是自動新增其他函式。

tdz​

boolean，預設為 false。

預設情況下，此外掛程式會忽略區塊作用域變數的暫時性死區 (TDZ)。下列程式碼在使用 Babel 轉譯時不會擲回錯誤，這不符合規範

JavaScript
i;
let i;

如果您需要這些錯誤，可以設定此外掛程式的 "tdz": true，指示 Babel 嘗試尋找這些錯誤。然而，目前的實作可能無法正確處理所有邊緣狀況，因此最好一開始就避免撰寫此類程式碼。

提示

您可以在 這裡進一步了解如何設定外掛程式選項