之前一直使用C#編寫桌面應用，也順帶寫一些Web端應用。最近在看node時發現常用的vscode是用electron編寫的，一種想吃螃蟹的念頭就湧了上來。
在網上找了找electron的資料，也研究了一下官方文件，發現electron app其實就是一個chrome瀏覽器，UI全部都是使用web端技術編寫的，因為之前一直使用Vue來寫Web應用，所以自然就想到Vue+Electron的組合。
在網上找了找，居然有現成的輪子Electron-Vue，立即install使用，可是發現最後卻不那麼如人意，在最後build時，總是出錯，後來終於發現是網路與build配置的問題。搞得人很頭疼。
於是最後決定自己動手，將Vue生成的靜態網頁與Electron結合。
1.Vue使用webpack專案，build之後在dist資料夾中會有靜態網頁生成，這樣生成的網頁放在web容器中可以正確訪問，但如果在本地直接開啟引用檔案路徑會出錯，後來發現是因為生成後的index.html與資源不在一個目錄層。
修改webpack專案中config/index.js為
1 build: { 2 // Template for index.html 3 index: path.resolve(__dirname, `../dist/index.html`), 4 5 // Paths 6 assetsRoot: path.resolve(__dirname, `../dist`), 7 assetsSubDirectory: `static`, 8 assetsPublicPath: `./`,
2.使用electron-quick-start快速構建出一個electron專案，將上面生成的檔案複製到electron專案的根目錄下，執行專案，發現正常執行。
3.可是上一步僅僅是在dev模式下執行，這裡使用electron-builder分發專案，全域性安裝electorn-builder後，輸入electron-builder –win –ia32 –dir即可完成專案的分發。