如何用wasm-pack发布同时支持浏览器与Node的Wasm库？

不需要分别执行两次wasm-pack publish，也不用拆成两个包发布。你可以通过以下步骤把两种构建版本整合到同一个npm包中：

步骤1：生成两种目标的构建产物 #

• 先构建适配浏览器打包工具的bundler版本：

  wasm-pack build -t bundler
  

  产物会默认生成在pkg目录。
• 再构建Node.js版本：

  wasm-pack build -t nodejs --out-dir pkg-node
  

  产物生成在pkg-node目录。

步骤2：合并产物并配置package.json #

• 将pkg-node目录下的文件（除了package.json）复制到pkg目录中。如果Wasm文件内容一致，无需重复复制，保留一份即可。
• 修改pkg目录下的package.json，添加多环境入口配置：

  {
    "main": "your_lib_name_node.js",
    "module": "your_lib_name.js",
    "browser": "your_lib_name.js",
    "files": [
      "your_lib_name.js",
      "your_lib_name_node.js",
      "your_lib_name_bg.wasm",
      "your_lib_name.d.ts"
    ]
    // 保留其他原有配置
  }
  

  各字段作用：
  • main：指定Node环境的入口文件
  • module/browser：指定浏览器及打包工具的入口文件

步骤3：发布单包 #

进入pkg目录，执行发布命令即可：

wasm-pack publish

额外注意事项 #

• 由于你的库没有浏览器专属依赖，两个构建版本的核心Wasm逻辑完全一致，共用同一份.wasm文件即可，能减少包体积。
• 发布前建议分别在Node项目和浏览器项目中测试引入，确保两种环境都能正常运行。

内容的提问来源于stack exchange，提问作者KevinH