跳至主要內容

@babel/plugin-transform-modules-systemjs

資訊

此外掛程式包含在 @babel/preset-env 的 modules 選項中

此外掛程式將 ECMAScript 模組轉換為 SystemJS。請注意，僅會轉換 import/export 陳述式 (import "./mod.js") 和 import 表達式 (import('./mod.js')) 的語法，因為 Babel 不知道 ECMAScript 模組和 SystemJS 實作之間不同的解析演算法。

範例​

輸入

JavaScript
export default 42;

輸出

JavaScript
System.register([], function(_export, _context) {
  return {
    setters: [],
    execute: function() {
      _export("default", 42);
    },
  };
});

如要支援動態載入 (import('./lazy.js').then(m => ...))，請在此外掛程式之前啟用 @babel/plugin-syntax-dynamic-import 外掛程式。

安裝​

npm install --save-dev @babel/plugin-transform-modules-systemjs

用法​

無選項

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

有選項

babel.config.json
{
  "plugins": [
    [
      "@babel/plugin-transform-modules-systemjs",
      {
        // outputs SystemJS.register(...)
        "systemGlobal": "SystemJS"
      }
    ]
  ]
}

透過 CLI​

Shell
babel --plugins @babel/plugin-transform-modules-systemjs script.js

透過 Node API​

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

選項​

moduleIds​

boolean 預設為 !!moduleId

新增於：v7.9.0

啟用模組 ID 產生。

moduleId​

字串

新增於：v7.9.0

用於模組的硬編碼 ID。無法與 getModuleId 搭配使用。

getModuleId​

(名稱：字串) => 字串

新增於：v7.9.0

給定 babel 生成的模組名稱，傳回要使用的名稱。傳回假值將使用原始 名稱。

moduleRoot​

字串

新增於：v7.9.0

要包含在產生的模組名稱中的根路徑。