vuejs electron webpack整合使用

世有因果知因求果發表於2017-11-22

傳統的vue SPA頁面在瀏覽器環境中使用,但是有的時候我們還希望能夠做成一個類似於桌面的app在PC上使用,希望不僅可以使用所有的瀏覽器SPA的功能,你也可能外加host os的功能,比如檔案的本地儲存,離線使用等。這時,electron就是一個很好的備選方案。electron本身整合了一個chrome核心的瀏覽器以及nodejs server模組,既可以使用已有的web技術棧,又能借助electron的跨平臺能力,從而實現cross-platform的原生app。

作為開發者,還有一個痛點就是對不同的平臺android, ios, windows pc, mac pc, linux pc分別要開發不同的程式碼,如何能夠實現一篇程式碼在不同device上使用呢?

一個思路是使用微信的小程式,小程式內嵌在微信中,使用web開發技能來構建小程式,由於微信本身是跨平臺的,支援各種不同的mobile作業系統,同樣也支援pc版本,因此可以作為一個很好的思路去嘗試。但是問題在於微信本身是一個封閉的生態,小程式開發雖然解決了開發者部分痛點,但是帶來新的痛點:必須依照微信定義的簡陋的開發規範,幾乎什麼都要自己去搭,無法使用巨大的開源力量。

另外一個思路就是使用阿里開源weex,weex專門用於解決開發人員的痛點:實現一份程式碼,在不同的os上執行,基於vuejs的元件式開發,能夠大大提高開發的效率。但是貌似PC版本無法支援,但是這個問題應該可以通過同樣聚焦於web開發跨平臺應用的electron來解決

https://weex.apache.org/cn/guide/index.html

https://github.com/SimulatedGREG/electron-vue

https://www.gitbook.com/book/simulatedgreg/electron-vue/details/cn

https://coligo.io/bookmarking-app-electron-vuejs-firebase/

 

相關文章