Electron-Vite-React项目Node服务进程路径配置问题求助

问题根源 #

Vite打包Electron项目时，默认仅处理main、renderer、preload三个目录的代码，你放在src/server下的文件未被纳入打包流程，导致编译后out目录缺少服务端代码，fork时自然找不到目标文件。

解决方案 #

1. 配置Vite打包server目录 #

根据你的代码类型选择以下两种方式：

方式一：直接复制server目录文件（适合无需编译的CommonJS代码）

• 先安装rollup-plugin-copy插件：

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

• 修改electron-vite.config.js，在main的build配置中添加复制规则：

  import { defineConfig } from 'electron-vite'
  import { resolve } from 'path'
  import copy from 'rollup-plugin-copy'
  
  export default defineConfig({
    main: {
      build: {
        rollupOptions: {
          plugins: [
            copy({
              targets: [
                {
                  src: resolve(__dirname, 'src/server/**/*'),
                  dest: resolve(__dirname, 'out/server')
                }
              ],
              hook: 'writeBundle' // 打包完成后执行复制
            })
          ]
        }
      }
    },
    // 保留原有renderer、preload配置
    renderer: {},
    preload: {}
  })
  

方式二：将server作为额外入口编译（适合ES模块代码）

如果server目录下的代码需要编译（比如使用ES模块语法），可把它作为main的额外入口：

import { defineConfig } from 'electron-vite'
import { resolve } from 'path'

export default defineConfig({
  main: {
    build: {
      rollupOptions: {
        input: {
          main: resolve(__dirname, 'src/main/index.js'),
          server: resolve(__dirname, 'src/server/server.js')
        },
        output: {
          dir: resolve(__dirname, 'out'),
          entryFileNames: '[name]/index.js' // 编译后server代码输出到out/server/index.js
        }
      }
    }
  },
  // 保留原有renderer、preload配置
  renderer: {},
  preload: {}
})

2. 调整fork路径适配环境 #

区分开发和生产环境，确保能正确定位server文件：

import { fork } from 'child_process'
import { resolve } from 'path'
import { app } from 'electron'

const isDev = !app.isPackaged
let serverPath

if (isDev) {
  // 开发环境直接指向src下的server.js
  serverPath = resolve(__dirname, '../server/server.js')
} else {
  // 生产环境根据打包方式调整：
  // 复制方式用../server/server.js，额外入口方式用../server/index.js
  serverPath = resolve(__dirname, '../server/server.js')
}

const serverProcess = fork(serverPath, {
  env: { PORT: 9090 }
})

3. 注意事项 #

• 修正路径拼写：原代码中../sync/server.js应为../server/server.js（对应src下的server目录）
• 打包后验证out/server目录是否存在目标文件，确保配置生效

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