@babel/插件提案-导入-wasm-源码

非官方测试版翻译

本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。 发现错误？ 报告问题 →

将 import source 声明转换为 WebAssembly.Module 对象，该转换基于 import source 用于导入 WebAssembly 模块源码的前提。

此插件应用的转换行为取决于顶层的 targets 配置，该配置用于确定生成代码应兼容 Node.js、浏览器还是两者。当目标环境为 Node.js 时，生成代码还会根据是否将模块编译为 CommonJS 格式而发生变化。

注意

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

示例

input.js

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

将被转换为

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")));

安装

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

Bun

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

用法

通过配置文件（推荐）

babel.config.json

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

通过命令行

Shell

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

通过 Node API

JavaScript

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

参考

• 提案：源码阶段导入