最近在學習nodejs,得知Electron是通過將Chromium和Node.js合並到同一個運行時環境中，用HTML，CSS和JavaScript來構建跨平臺桌面應用程序的一門技術。對於之前一直從事flash AIR桌面應用開發的我迫不及待的想“嘗嘗鮮”。

首先，我們跟著Electron社區的快速入門程序（https://electronjs.org/docs/tutorial/quick-start）創建我的第一個electron App（HelloWorld）。

1.在命令行裏安裝全局electron：

npm install -g electron

Ps:在這之前你需要安裝nodejs，npm。

2.參照入門程序，app創建完成，包機構如下：

前面我們全局安裝了electron，如何運行app呢？

在當前窗口打開命令行，輸入如下命令：

electron .

app創建成功！不要著急，本講的重點是介紹如何打包成exe（折騰了我大半天），看了好多別人關於打包的博文，可能由於自己是一個初學者理解不夠深入，覺得都不是那麽通俗易懂，所以準備趁熱打鐵，寫一篇分享給後面學習的人。言歸正傳，

3.安裝打包工具，我是使用的electron-packager，首先全局安裝一下：

npm install electron-packager -g

4.打包之前需要在當前app裏安裝依賴（上面運行是利用electron的全局命令，打包需要app裏安裝自己的依賴，後面且稱做局部依賴），當前app的依賴只有electron，在命令行執行：

electron -v

獲取當前electron全局安裝的版本號。

5.編輯package.json，npm安裝局部依賴:

npm install

6.測試局部依賴是否安裝成功，在app根目錄執行命令行：

npm start

程序運行，局部依賴安裝成功。

7.打包前為當前app制作icon：icon.ico，256*256。制作好放入app根目錄。

8.electron-packager打包：electron-packager打包有兩種方式，一是直接在命令行編輯命令，直接進行打包。另一種是在package.json裏編輯package，執行npm run-script package。

(1)在app根目錄執行命令行：

electron-packager . ‘HelloWorld‘ --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1

打包成功。如圖

（2）首先編輯package.json，

在app(electron-helloworld)根目錄創建app文件夾，並把main.js， index.html 和 package.json拷貝進去（拷貝並非剪切），然後在electron-helloworld根目錄打開命令行：

npm run-script package

打包成成功。

小結：對於electron-packager的第二種打包方法（編輯package.json的打包方法），為什麽要建app文件夾，是通過看別人的博文和多次測試得到的結論，由於是初學，暫且認為是一種機制吧，希望通過後面的學習來更加深刻的認識裏面的含意。

Electron入門應用打包exe（windows）