搞的比較垃圾
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
github地址
安裝依賴
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
有問題可以下方留言，看到了會回復哦
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/243889.html
標籤：其他