Electron + Vite构建时如何将bin目录下的wasm及worker文件纳入产物？

核心问题是Vite默认仅打包被模块系统追踪的资源，而你通过动态创建script标签引入module.js的方式，导致Vite无法识别它依赖的.wasm和.worker.js文件，最终构建时遗漏了这两个文件。以下是三种可行的解决办法：

方法1：修正vite-plugin-static-copy配置，覆盖构建阶段 #

检查并调整你的Vite配置，确保插件在生产构建时也会复制完整的bin目录：

// vite.config.js
import { defineConfig } from 'vite';
import { viteStaticCopy } from 'vite-plugin-static-copy';

export default defineConfig({
  plugins: [
    viteStaticCopy({
      targets: [
        {
          src: './bin/**/*', // 匹配bin目录下所有文件及子项
          dest: 'bin' // 复制到dist目录下的bin子文件夹
        }
      ],
      copyOnce: false // 取消单次复制限制，确保开发/构建阶段都执行
    })
  ]
});

执行vite build后，检查dist/bin目录是否包含三个目标文件。

方法2：利用Vite的public目录自动复制静态资源 #

Vite的public目录会被原样复制到构建产物根目录，无需额外插件配置：

1. 将整个bin文件夹移动到项目根目录的public文件夹下
2. 修改动态引入module.js的路径：

const script = document.createElement('script');
script.src = '/bin/module.js'; // 路径改为根目录下的bin文件夹
document.head.appendChild(script);

构建时Vite会自动把public/bin下的所有文件复制到dist/bin目录。

方法3：在Electron Forge配置中强制纳入资源 #

如果前两种方法仍有问题，直接在Electron Forge配置中指定要打包的额外资源：

// forge.config.js
module.exports = {
  packagerConfig: {
    // 将dist下的bin文件夹作为额外资源打包
    extraResource: ['./dist/bin/'],
    // 或更精确地指定源文件路径
    files: [
      'dist/**/*',
      './bin/**/*'
    ]
  },
  // 其他Electron Forge配置项...
};

执行electron-forge make时，这些文件会被打包到应用的资源目录中，可通过相对路径或path.join(__dirname, '../bin/module.js')这类绝对路径访问。

额外注意事项 #

• 构建后务必检查文件路径正确性，渲染进程用相对路径时要匹配dist目录结构，主进程建议用绝对路径定位文件
• 每次构建前清理旧的dist目录，避免缓存导致的文件缺失

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