搞的比較垃圾
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
npm run builds
執行完成後
在electron文件夾中
npm run build
安裝依賴
npm install
熱開發頁面
npm run serve
只打包vue 不打包electron
npm run builds
打包的文件在electron下
熱開發頁面
npm run build
執行完成後
開啓額外的控制檯
cd electron
npm run serve
熱開發electron
npm run builds
執行完成後
開啓額外的控制檯
cd electron
npm run serve
打包electron應用
最終打包需要刪除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：推薦不溫卜火 一定要看哦
一些插件的使用等
大學之道亦在自身，努力學習，熱血青春
如果對編程感興趣可以加入我們的qq羣一起交流：974178910
有問題可以下方留言，看到了會回覆哦