目的
講解Electron 和 vue-cli 結(jié)合起來(lái)開(kāi)發(fā)項(xiàng)目,使用最新版本進(jìn)行功能開(kāi)發(fā),同時(shí)匯總一些問(wèn)題解決方案減少重復(fù)查找問(wèn)題解決方案的時(shí)間
1.項(xiàng)目環(huán)境搭建
參考文章 手把手教你使用Electron5+vue-cli3開(kāi)發(fā)跨平臺(tái)桌面應(yīng)用
2.項(xiàng)目設(shè)置
通過(guò)vue.config.js配置項(xiàng)目名稱,圖標(biāo),及其他(參照鏈接可以配置成功)
3.加載配置
基于框架需要加載的一些開(kāi)發(fā)工具(devtools)
官方文檔開(kāi)發(fā)工具擴(kuò)展程序
npm插件https://www.npmjs.com/package/electron-devtools-installer
推薦使用npm插件方式,配置簡(jiǎn)單
4.注意項(xiàng)目
1.Electron 框架盡量和官方同步更新,官方版本更新過(guò)快,API使用方式也在變更
2.開(kāi)發(fā)環(huán)境中使用history方式,編譯版本使用Hash,否則會(huì)造成項(xiàng)目在開(kāi)發(fā)環(huán)境中頁(yè)面無(wú)法刷新問(wèn)題
3.基本環(huán)境判斷條件盡量統(tǒng)一,不要存在多種環(huán)境變量進(jìn)行判斷
4.element加載electron-vue在使用element-ui時(shí)部分組件無(wú)法顯示問(wèn)題