中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Electron + vue 打包桌面操作流程詳解

發布時間:2020-08-30 13:00:32 來源:腳本之家 閱讀:726 作者:me_zhazha 欄目:web開發

提前準備一個vue項目,也可以使用初始的vue項目

vue init webpack

安裝到后邊有的會出現報錯,可以忽略,啟動npm run dev 啟動成功就可以

在vue項目下執行下載以下依賴,會用到

cnpm install electron --save-dev
cnpm install electron-packager --save-dev //這個是打成exe文件的插件,之后要用,提前下載好

獲取Electron的資源

git clone https://github.com/electron/e...
cd electron-quick-start
cnpm install //這里我用的是cnpm,npm太慢了

將Electron獲取到資源的main.js復制到vue里面的bulid里面并修改為electron.js

Electron + vue 打包桌面操作流程詳解

然后修改

Electron + vue 打包桌面操作流程詳解

將assetsPublicPath: '/' 改為./,都是為了獲取準確的路徑

然后再修改electron.js

Electron + vue 打包桌面操作流程詳解

改為 這個pathname: path.join(__dirname, '../dist/index.html')

不懂的可以去搜vue 的 dist

這些改好了之后配置package.json

Electron + vue 打包桌面操作流程詳解

用來啟動 npm run abc

啟動成功為

Electron + vue 打包桌面操作流程詳解

啟動成功可以執行下一步

在配置打包的package.json

Electron + vue 打包桌面操作流程詳解

關于electron-packager的配置,簡單介紹一下。

electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]

sourcedir 資源路徑,在本例中既是./dist/

appname 打包出的exe名稱

platform 平臺名稱(windows是win32)

arch 版本,本例為x64

到這里還沒有完因為還有坑呢

我就把坑跳過

Electron + vue 打包桌面操作流程詳解

將bulid的electron.js文件復制到dist中,將package.json也復制到當中(提示dist文件和里面內容自動生成不用自己創建)

然后修改electron.js

mainWindow.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))

再修改復制到dist中的package.json

Electron + vue 打包桌面操作流程詳解

再啟動npm run go 會出現打包成功的文件夾

再從里面尋找exe文件 就可以了!!!!!

總結

以上所述是小編給大家介紹的Electron + vue 打包桌面操作流程詳解,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!
如果你覺得本文對你有幫助,歡迎轉載,煩請注明出處,謝謝!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

五寨县| 常德市| 冀州市| 友谊县| 修文县| 赣州市| 天气| 马关县| 塘沽区| 丰顺县| 汾阳市| 宿松县| 浪卡子县| 伊通| 马关县| 施甸县| 武汉市| 莱阳市| 卢湾区| 武强县| 临夏县| 宜城市| 乌兰察布市| 靖州| 子长县| 定远县| 瓦房店市| 永德县| 余姚市| 天柱县| 榆树市| 祁东县| 洛隆县| 滁州市| 鹤峰县| 嘉峪关市| 合肥市| 黔江区| 昌平区| 大丰市| 册亨县|