@babel/plugin-proposal-import-wasm-source

将 import source 声明转换为 WebAssembly.Module 对象，假设 import source 用于导入 WebAssembly 模块的源。

¥Transforms import source declarations to WebAssembly.Module objects, assuming that import source is being used to import the source of a WebAssembly Module.

该插件应用的转换取决于你的顶层 targets 来检测生成的代码是否应与 Node.js、浏览器或两者兼容。当以 Node.js 为目标时，生成的代码也会根据你是否将模块编译为 CommonJS 而改变。

¥The transformation applied by this plugin depends on your top-level targets to detect whether the generated code should be compatible with Node.js, browsers, or both. When targeting Node.js, the generated code will also change depending on whether you are compiling modules to CommonJS or not.

提醒

将模块编译为 AMD、SystemJS 或 UMD 时不能使用此插件。

¥This plugin cannot be used when compiling modules to AMD, SystemJS, or UMD.

示例

¥Example

input.js

import source libMod from "./lib.wasm";

将转变为

¥will be transformed to

Browsers

output.js

const libMod = await WebAssembly.compileStreaming(fetch(import.meta.resolve("./lib.wasm")));

Node.js (ESM)

output.js

import { readFileSync as _readFileSync } from "fs";
const libMod = new WebAssembly.Module(_readFileSync(new URL(import.meta.resolve("./lib.wasm"))));

Node.js (CommonJS)

output.js

"use strict";

const libMod = new WebAssembly.Module(require("fs").readFileSync(require.resolve("./lib.wasm")));

安装

¥Installation

npm

npm install --save-dev @babel/plugin-proposal-import-wasm-source

Yarn

yarn add --dev @babel/plugin-proposal-import-wasm-source

pnpm

pnpm add --save-dev @babel/plugin-proposal-import-wasm-source

用法

¥Usage

使用配置文件（推荐）

¥With a configuration file (Recommended)

babel.config.json

{
  "plugins": [
    "@babel/plugin-proposal-import-wasm-source"
  ]
}

通过 CLI

¥Via CLI

Shell

babel --plugins=@babel/plugin-proposal-import-wasm-source script.js

通过 Node API

¥Via Node API

JavaScript

require("@babel/core").transformSync("code", {
  plugins: [
    "@babel/plugin-proposal-import-wasm-source"
  ],
});

参考

¥References

• 提议：源阶段导入

  ¥Proposal: Source Phase Imports