Rollup构建会排除大于2MB文件？含大体积.wasm文件的npm包构建问题求解

DevOps 小满

2026-7-27

解决Rollup构建后丢失大体积.wasm文件的方案

Rollup默认对大型二进制文件的处理逻辑，或是部分npm包的发布/安装过滤规则，会导致大于2MB的.wasm文件在构建后从node_modules中消失，以下是几种优雅的解决思路：

1. 用Rollup复制插件保留.wasm文件

通过@rollup/plugin-copy在构建完成后自动将node_modules中的目标.wasm文件复制到输出目录：

先安装插件：

npm install @rollup/plugin-copy --save-dev

修改rollup.config.js：

import copy from '@rollup/plugin-copy';

export default {
  // 你的其他Rollup配置
  plugins: [
    // 已有的插件
    copy({
      targets: [
        {
          src: 'node_modules/[你的目标包名]/**/*.wasm', // 替换为实际包内的.wasm路径
          dest: 'dist/assets/wasm' // 输出到构建目录的指定位置
        }
      ],
      hook: 'writeBundle' // 确保在构建完成后执行复制
    })
  ]
};

2. 调整npm安装与包配置

如果是npm安装阶段就过滤了大体积.wasm：

检查目标包的package.json的files字段或.npmignore文件，若有权限修改，将.wasm文件加入files列表，确保发布时包含；
若是第三方包无法修改，可手动从包的发布源下载对应.wasm文件，放到项目的静态资源目录，然后修改代码中的引用路径指向本地文件。

3. 用Rollup URL插件处理二进制文件

@rollup/plugin-url可以自动识别项目中引用的.wasm文件，将其复制到输出目录并返回正确的引用路径：

安装插件：

npm install @rollup/plugin-url --save-dev

配置Rollup：

import url from '@rollup/plugin-url';

export default {
  // 其他配置
  plugins: [
    // 已有插件
    url({
      include: ['**/*.wasm'],
      limit: 0, // 不内嵌文件，直接复制到输出目录
      destDir: 'dist/assets/wasm'
    })
  ]
};