@babel/plugin-proposal-import-defer

將 import defer 宣告轉換為延遲的 require() 呼叫。

注意

此外掛程式只能在同時將模組編譯為 CommonJS 時使用。

範例

input.js

import defer * as lib from "lib";

later(() => {
  console.log(lib.value);
});

將轉換為

output.js

"use strict";

function lib(data) {
  lib = () => data;
  return data = _interopRequireWildcard(require("lib"));
}

later(() => {
  console.log(lib().value);
});

安裝

npm

npm install --save-dev @babel/plugin-proposal-import-defer

Yarn

yarn add --dev @babel/plugin-proposal-import-defer

pnpm

pnpm add --save-dev @babel/plugin-proposal-import-defer

用法

使用設定檔（建議）

babel.config.json

{
  "plugins": [
    "@babel/plugin-proposal-import-defer",
    "@babel/plugin-transform-modules-commonjs"
  ]
}

透過 CLI

Shell

babel --plugins=@babel/plugin-proposal-import-defer,@babel/plugin-transform-modules-commonjs script.js

透過 Node API

JavaScript

require("@babel/core").transformSync("code", {
  plugins: [
    "@babel/plugin-proposal-import-defer",
    "@babel/plugin-transform-modules-commonjs"
  ],
});

參考資料

• 建議：遞延匯入評估