初學electron
接觸了兩周的electron，感覺還不錯，以后pc端基本上可以用electron加殼寫pc端應用了，可以用nodejs的模塊，也可以用es6、7，還可以直接操作系統文件。基本上可以完成大多數pc應用了。
就是安裝慢成狗了。。。。用鏡也卡！
快速開始
Electron通過為運行時提供豐富的本機（操作系統）API，可以使用純JavaScript創建桌面應用程序。您可以將其看作是Node.js運行時的一種變體，它專注於桌面應用程序而不是Web服務器。
這並不意味着Electron是JavaScript綁定到圖形用戶界面（GUI）庫。相反，Electron使用網頁作為其GUI，因此您也可以將其視為由JavaScript控制的最小的Chromium瀏覽器。
主要過程
在電子，在運行過程中package.json的main腳本被稱為主處理。在主進程中運行的腳本可以通過創建網頁來顯示GUI。
渲染器過程
由於Electron使用Chromium來顯示網頁，因此也使用了Chromium的多進程架構。Electron中的每個網頁都在其自己的進程中運行，這稱為渲染器進程。
在正常的瀏覽器中，網頁通常在沙箱環境中運行，並且不允許訪問本機資源。然而，電子用戶有能力在網頁中使用Node.js API，允許較低級別的操作系統交互。
主進程和渲染器進程之間的差異
主進程通過創建BrowserWindow實例來創建網頁。每個BrowserWindow實例在其自己的渲染器進程中運行網頁。當BrowserWindow實例被銷毀時，相應的渲染器進程也被終止。
主進程管理所有網頁及其相應的渲染器進程。每個渲染器進程是隔離的，只關心在其中運行的網頁。
在網頁中，不允許調用本地GUI相關的API，因為管理網頁中的本地GUI資源是非常危險的，並且容易泄漏資源。如果要在Web頁面中執行GUI操作，則Web頁面的渲染器進程必須與主進程通信，以請求主進程執行這些操作。
在Electron中，我們有幾種方法在主進程和渲染器進程之間進行通信。Like ipcRenderer和ipcMain用於發送消息的模塊，以及用於RPC樣式通信的遠程模塊。還有一個關於如何在網頁之間共享數據的常見問題條目。
寫你的第一電子應用程序
通常，Electron應用程序的結構如下：
your-app/
├── package.json
├── main.js
└── index.html
其格式與package.jsonNode模塊的格式完全相同，main字段指定的腳本是應用程序的啟動腳本，它將運行主進程。您的示例package.json可能如下所示：
{ "name" : "your-app", "version" : "0.1.0", "main" : "main.js" }
注意：如果main字段不存在package.json，Electron將嘗試加載index.js。
本main.js應創建窗口和處理系統事件，一個典型的例子是：
const {app, BrowserWindow} = require('electron') const path = require('path') const url = require('url') // Keep a global reference of the window object, if you don't, the window will // be closed automatically when the JavaScript object is garbage collected. let win function createWindow () { // Create the browser window. win = new BrowserWindow({width: 800, height: 600}) // and load the index.html of the app. win.loadURL(url.format({ pathname: path.join(__dirname, 'index.html'), protocol: 'file:', slashes: true })) // Open the DevTools. win.webContents.openDevTools() // Emitted when the window is closed. win.on('closed', () => { // Dereference the window object, usually you would store windows // in an array if your app supports multi windows, this is the time // when you should delete the corresponding element. win = null }) } // This method will be called when Electron has finished // initialization and is ready to create browser windows. // Some APIs can only be used after this event occurs. app.on('ready', createWindow) // Quit when all windows are closed. app.on('window-all-closed', () => { // On macOS it is common for applications and their menu bar // to stay active until the user quits explicitly with Cmd + Q if (process.platform !== 'darwin') { app.quit() } }) app.on('activate', () => { // On macOS it's common to re-create a window in the app when the // dock icon is clicked and there are no other windows open. if (win === null) { createWindow() } }) // In this file you can include the rest of your app's specific main process // code. You can also put them in separate files and require them here.
最后index.html是您要顯示的網頁：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World!</title> </head> <body> <h1>Hello World!</h1> We are using node <script>document.write(process.versions.node)</script>, Chrome <script>document.write(process.versions.chrome)</script>, and Electron <script>document.write(process.versions.electron)</script>. </body> </html>
運行您的應用程序
一旦你創建了初始main.js，index.html和package.json文件，你可能想嘗試在本地運行你的應用程序來測試它，並確保它的工作正常。
electron
electron是npm包含Electron的預編譯版本的模塊。
如果您已經在全局安裝npm，那么您只需要在應用程序的源目錄中運行以下命令：
electron .
如果您已在本地安裝，請運行：
macOS / Linux
$ ./node_modules/.bin/electron .
視窗
$ .\node_modules\.bin\electron .
手動下載的電子二進制
如果您手動下載了電子郵件，您還可以使用包含的二進制文件直接執行您的應用程序。
視窗
$ .\electron\electron.exe your-app\
Linux
$ ./electron/electron your-app/
macOS
$ ./Electron.app/Contents/MacOS/Electron your-app/ Electron.app這里是Electron的發行包的一部分，你可以從這里下載。
作為分發版運行
完成編寫應用程序后，您可以按照應用程序分發指南創建分發，然后再執行打包的應用程序。
試試這個例子
使用存儲electron/electron-quick-start庫克隆並運行本教程中的代碼。
注意：運行此操作需要在系統上使用Git和Node.js（其中包括npm）。
# Clone the repository $ git clone https://github.com/electron/electron-quick-start # Go into the repository $ cd electron-quick-start # Install dependencies $ npm install # Run the app $ npm start