搞的比较垃圾 vue-cli版本为4.5.x 可以使用vue的各种插件
框架会在一个实践中持续完善 实践项目地址 https://blog.csdn.net/qq_42027681/category_10690045.html
github地址
Vue2.x版本
https://github.com/dmhsq/electron-vue-dmhsq 或者 https://github.com/dmhsq/electron-vue/tree/main/template
Vue3.x版本
https://github.com/dmhsq/electron-vue3-dmhsq
electron中的 dist和src为测试 不用理会
克隆文件
Vue2.x版本
git clone https://github.com/dmhsq/electron-vue-dmhsq.git
Vue3.x版本
git clone https://github.com/dmhsq/electron-vue3-dmhsq.git
目录说明
electron文件夹控制桌面端的运行打包 其余均为 vue目录 electron/main.js 桌面应用主程序 electron/main.js 桌面应用渲染程序
electron-vue-dmhsq
如果您只是想打包vue项目成exe
代码语言：javascript复制npm run builds
执行完成后
在electron文件夹中
npm run buildgithub地址
安装依赖
代码语言：javascript复制npm install热开发页面
代码语言：javascript复制npm run serve只打包vue 不打包electron
代码语言：javascript复制npm run builds
打包的文件在electron下热开发页面
代码语言：javascript复制npm run build
执行完成后
开启额外的控制台
cd electron
npm run serve热开发electron
代码语言：javascript复制npm run builds
执行完成后
开启额外的控制台
cd electron
npm run serve打包electron应用
代码语言：javascript复制最终打包需要删除electron/main.js中的fs模块
npm run builds
执行完成后（如果页面已经打包过无需此步）
在electron文件夹中
npm run build演示
vue页面热开发
electron页面热开发
修改vue文件 重载窗口
开发electron(暂未实现热更新 毕竟需要重启app后面会想想办法)
在 electron/mian.js中可以增加额外窗口 和win交互等等 electron开发请参考官方文档 https://www.electronjs.org/docs
打包为exe程序
教程
详细教程请参考 https://blog.csdn.net/qq_42027681/category_10690045.html
下载electron-vue-dmhsq
有git的 克隆一份
Vue2.x版本
git clone https://github.com/dmhsq/electron-vue-dmhsq.git 或者 下载 下载地址
Vue3.x版本
git clone https://github.com/dmhsq/electron-vue3-dmhsq.git https://github.com/dmhsq/electron-vue3-dmhsq 或者 下载 下载地址
正常开发页面
正常开发网页即可 vue的插件依赖什么的该用用 elementui会让页面更好看
开发win/mac交互
开发electron/main.js文件 参考官方文档 https://www.electronjs.org/docs
打包
npm run builds 执行完成后 在electron文件夹中 npm run build
大家好，我是代码哈士奇，是一名软件学院网络工程的学生，因为我是“狗”，狗走千里吃肉。想把大学期间学的东西和大家分享，和大家一起进步。但由于水平有限，博客中难免会有一些错误出现，有纰漏之处恳请各位大佬不吝赐教！暂时只在csdn这一个平台进行更新，博客主页：https://blog.csdn.net/qq_42027681。
未经本人允许，禁止转载
后续会推出
前端：vue入门 vue开发小程序 等 后端： java入门 springboot入门等 服务器：mysql入门 服务器简单指令 云服务器运行项目 python：推荐不温卜火 一定要看哦 一些插件的使用等
大学之道亦在自身，努力学习，热血青春
