Electron+React项目打包踩坑记录

首先,如何打包

写下本文的时间是 2024/01/16,搜索了网络上 Electron+React 的打包方式,中间行不通,本文采用的方式是记录本文时 Electron 快速入门(https://www.electronjs.org/zh/docs/latest/tutorial/quick-start)记录的打包方式,最主要的区别在于把 html 文件换成 React 项目打包后 build 文件夹里面的 html 文件了,如下图

踩坑记录

  • 打包前把 package.json 里面的字段补全,否则会报错,直接把下面这段复制粘贴进文件即可
js 复制代码
{
  "name": "my-electron-app",
  "version": "1.0.0",
  "description": "Hello World!",
  "main": "main.js",
  "author": "Jane Doe",
  "license": "MIT"
}
  • 执行 npx electron-forge import 时魔法需要开全局模式
  • npm run make 时不能开魔法
  • build/index.html 里面的路径需要加上 .,比如 href 属性里的路径,react 打包后默认是不带 . 的,需要自己加上
相关推荐
Wild~~5 小时前
electron-vite
前端·javascript·electron
by__csdn5 小时前
Electron+Vite:实现electron + vue3 + ts + pinia + vite高效跨平台开发指南
前端·javascript·vue.js·typescript·electron·node.js·vue
大师兄66685 小时前
Qt-for-鸿蒙PC-Electron应用鸿蒙平台白屏问题修复实战
qt·electron·harmonyos
国服第二切图仔5 小时前
Electron 鸿蒙pc开发环境搭建完整保姆级教程(window)
javascript·electron·harmonyos
秋雨雁南飞5 小时前
Electron 将网站打包成桌面程序
electron
●VON13 小时前
Electron for HarmonyOS 开发环境搭建
javascript·electron·harmonyos
肥仔哥哥19301 天前
Electron + vue架构替换WPF
electron·electron替换·electron替换wpf
柒儿吖1 天前
Electron for 鸿蒙PC 窗口问题完整解决方案
javascript·electron·harmonyos
起名时在学Aiifox2 天前
深入解析 Electron 打包中的 EPERM: operation not permitted 错误
前端·javascript·electron
by__csdn2 天前
Electron入门:跨平台桌面开发指南
前端·javascript·vue.js·typescript·electron·html