1.安裝node
2.安裝vue/cli
$ npm install @vue/cli -g
3.創建應用並進入應用目錄
$ vue create my-app
$ cd my-app
4.添加electron-builder
$
vue add electron-builder
會讓你選擇electron版本,默認即可
然后是漫長且龜速的下載,耐心等待
有極高的幾率安裝失敗,基本都是網絡問題(你懂的)
所以,我們先設置electron的源地址,修改為淘寶鏡像
$ npm config set electron_mirror https://npm.taobao.org/mirrors/electron/
然后再一次
$
vue add electron-builder
瞬間就成功了!!!
5.添加vuetify
$ vue add vuetify
6.運行
$ npm run electron:serve
7.打包(windows X64)
在根目錄創建vue.config.js文件,並編輯其內容:
生成安裝包:
$ npm run electron:build
由於網絡問題,極大可能在很多步發生下載錯誤403:
若是electron出錯,手動復制出錯地址用下載工具下載后,拷貝到如下目錄:
C:\Users\用戶名\AppData\Local\electron\Cache\
若是 app-builder或winCodeSign或nsis或nsis-resources 報錯,同樣復制鏈接手動下載后,拷貝至對應目錄:
目錄結構如下:
再次Build:
$ cnpm run electron:build
成功:
在項目的dist目錄下,可看到生成的安裝包:
雙擊后即可安裝運行。