今天這篇文章是講述一下 融合了vue-cli+electron的一種新的腳手架，省去許多繁瑣配置，即vue-electron。

下面就說一下安裝和使用，假設你的電腦已經安裝node.js,並且已經全局搭建好vue-cli腳手架，如果沒有的話，打開終端：$npm install --global vue-cli 全局安裝。

1.新建文件夾，cd 到你將要安裝的文件夾目錄，$vue init simulatedgreg/electron-vue

這一步驟極其相似於當初安裝vue-cli腳手架時，一個一個步驟來，截幾張圖

類似於這樣 選擇 enter yes 或者 no 看自己的選擇

註意這一步呢，我選擇了electron-packager 項。到這裏你就可以看到，本來的空文件夾裏現在新建了vue-electron基礎文件

2.$npm install 這一步主要是安裝依賴，耗時有點久。完畢後項目內多了node_modules 文件夾，裏面東西較多。如圖：

3.$npm run dev 會出現的界面如圖：右下角是一起出來的控制臺

哈哈，完美呈現出來桌面應用。

4.打包。先看看項目package.json文件截圖

scripts內各種打包命令，其中就包括Mac、Windows、Linux三大平臺。例如我想在Mac上打包運行，$npm run build:darwin 就會在項目的build文件夾下生成一個應用程序，以此類推，，，$npm run build:win32 等

vue-electron腳手架最大好處就是我們不要在Vue項目裏手動配置electron了，極好的融合了Vue-cli+electron ,省去開發者大把時間去配置。

另外不得不說一下，vue-electron主要業務邏輯都放在了src->renderer文件夾內去寫，和之前的vue-cli搭建項目可以說是沒有任何區別，很贊是吧！

vue-electron腳手架安裝及說明 打包基於Vue的 桌面應用程序