如何用electron-vue 建立Vue項目

前面的話

如何使用Electron-vue來建構Vue項目呢？這篇文章小柒與大家一起來一步一步建立。 前提條件：node.js、vue/vue-cli、webpack、Electron都要有了解哦。

用electron-vue 如何建立Vue項目

通過下面這條指令，就可以建立一個electron-vue項目了。

vue init simulatedgreg/electron-vue ele-vue-learning
           

模闆下載下傳完畢之後，還需要根據你項目進行一些額外的配置，如下圖所示：

小柒這裡使用的是electron-packager。

看看整體架構：

完成配置之後就可以運作了，執行指令：

1、進入檔案夾ele-vue-learning：  cd ele-vue-learning
 2、下載下傳包： cnpm install
 3、運作： npm run dev
           

打包成跨平台的檔案

這裡打包成windows平台的exe檔案

  

在package.json中其實已經為我們配置好了相關的指令：

執行指令：

npm run build:win32
           

打包成exe檔案會很慢。