使用electron官方給出的`electron-quick-start`示例項目，將其拷貝下來，

git clone https://github.com/electron/electron-quick-start.git

裏面三個主要的文件：

---- index.html 起始頁

---- main.js 顯示項目啟動後的窗口，裏面可以做一些配置，比如瀏覽器窗口大小，起始頁設置

---- renderer.js 裏面的註釋翻譯一下就了解了，主要是放業務相關js的，既可以訪問dom，也可以使用node API

然後 npm install 安裝模塊

npm start 啟動，可看到一個hello world！的框框

如何將項目發布為app呢

1.在起始頁上使用iframe標簽引入項目，即

index.html:

  
  <div>

        <iframe src="https://www.baidu.com” frameborder="0"> 
        </iframe>   

    </div>

 

 //src 裏放置你的線上項目的url  即可

2.安裝

npm install electron-packager -g

3.執行打包

electron-packager就會自動判別當前的操作系統打包對應的文件，win下.exe, Mac 下.app

electron-packager . aloe --out ../electron -all

解釋：

將當前目錄下的文件輸出到 electron ，並命名為aloe ，-all表示一次性把所有的操作系統都打包一遍

使用electron搭建桌面app的簡便方法