第一步:安装 Electron 依赖
在你的 intellimonitor-app 文件夹下运行:
code
Bash
npm install electron electron-is-dev
第二步:创建入口文件
在根目录创建一个 main.js(这是 Electron 的主进程文件):
第一步:构建前端资源
首先,你需要把 React 代码编译成普通的 HTML/JS 文件(存放在 dist 文件夹中):
code
Bash
npm run build
第二步:运行打包命令
运行你刚才在 package.json 中配置的 dist 脚本:
code
Bash
npm run dist
打包过程中会发生什么?
electron-builder 会启动。
它会下载适合你系统的 Electron 二进制文件。
它会将你的 dist 文件夹、main.js 和 package.json 封装在一起。
它会生成一个 release 文件夹(在项目根目录下)。
在这个文件夹里,你会看到一个类似 IntelliMonitor Setup 1.0.0.exe 的安装文件。
解决方案:执行安装命令
在你的项目根目录下运行以下命令,把这些工具真正下载到你的电脑里:
code
Bash
npm install
如果你在中国大陆,为了速度更快,可以使用:
code
Bash
npm install --registry=https://registry.npmmirror.com
- 正确的打包流程
安装完成后,按照以下步骤进行:
创建 main.js:确保它在根目录(和 package.json 在一起)。
清理 index.html:为了让打包后的应用能离线运行,我们需要移除里面的外部链接(esm.sh),让 Vite 把所有代码都打包进本地。
运行打包:npm run dist