原創(chuàng)文章，轉(zhuǎn)載請注明出處
附官方文檔鏈接：http://www.electronjs.org/docs/tutorial/first-app

1. 創(chuàng)建空文件夾，執(zhí)行npm init，生成package.json文件
2. 安裝依賴 npm install --save-dev electron
3. 在 package.json文件中scripts添加 "start": "electron ."，此步可預(yù)覽項(xiàng)目
4. 創(chuàng)建 main.js文件
5. 在 main.js文件添加以下代碼(至于代碼什么意思，都有注釋，自己自行查看，再不行看文檔)

const { app, BrowserWindow } = require('electron')

function createWindow () {   
  // 創(chuàng)建瀏覽器窗口
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  })

  // 并且為你的應(yīng)用加載index.html
  win.loadFile('index.html')

  // 打開開發(fā)者工具
  win.webContents.openDevTools()
}

// Electron會(huì)在初始化完成并且準(zhǔn)備好創(chuàng)建瀏覽器窗口時(shí)調(diào)用這個(gè)方法
// 部分 API 在 ready 事件觸發(fā)后才能使用。
app.whenReady().then(createWindow)

//當(dāng)所有窗口都被關(guān)閉后退出
app.on('window-all-closed', () => {
  // 在 macOS 上，除非用戶用 Cmd + Q 確定地退出，
  // 否則絕大部分應(yīng)用及其菜單欄會(huì)保持激活。
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  // 在macOS上，當(dāng)單擊dock圖標(biāo)并且沒有其他窗口打開時(shí)，
  // 通常在應(yīng)用程序中重新創(chuàng)建一個(gè)窗口。
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

// 您可以把應(yīng)用程序其他的流程寫在在此文件中
// 代碼 也可以拆分成幾個(gè)文件，然后用 require 導(dǎo)入。

6. 將package.json文件中的啟動(dòng)文件設(shè)置為main.js，如："main": "main.js",, package.json文件代碼附上，如下：

{
  "name": "ele-platform",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron ."
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "electron": "^9.0.5"
  }
}

7. 執(zhí)行npm start運(yùn)行查看項(xiàng)目
8. 自此，創(chuàng)建完畢