vuetify & electron (開發環境及打包)


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目錄下,可看到生成的安裝包:

雙擊后即可安裝運行。

 

 
       


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM