環境
安裝node
全局安裝electron
npm install -g electron
克隆遠程倉庫
克隆這倉庫
git clone https://github.com/electron/electron-quick-start
進入倉庫
cd electron-quick-start
安裝依賴庫
npm install
運行應用
npm start
手動創建
新建文件夾
mkdir electron-demo
安裝依賴
npm install electron --save-dev
新建文件
-
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h2>hello world</h2> </body> </html> -
main.js
var electron = require('electron') //引入electron模塊 var app = electron.app // 創建electron引用 var BrowserWindow = electron.BrowserWindow; //創建窗口引用 var mainWindow = null ; //聲明要打開的主窗口 // 監聽應用準備完成的事件 app.on('ready', () => { mainWindow = new BrowserWindow({width:400, height:400}) //設置打開的窗口大小 mainWindow.loadFile('index.html') //加載那個頁面 //監聽關閉事件，把主窗口設置爲null mainWindow.on('closed', () => { mainWindow = null }) }) //監聽所有窗口關閉的事件 app.on('window-all-closed', function () { if (process.platform !== 'darwin') { app.quit(); } })
初始化package.json文件
npm init --yes
運行
electron .
electron-forge 腳手架搭建
安裝electron-forge
npm install -g electron-forge
初始化項目
electron-forge init my-new-app
此處到最後會一直在下載中，可以使用ctrl+c終止掉，然後進入目錄，使用cnpm或者yarn安裝
進入目錄
- cd my-new-app
啓動
electron .