node -v
npm -v
安装node环境
my-electron-app/
├── package.json
├── main.js
└── index.html
为您的项目创建一个文件夹并安装 Electron:
mkdir my-electron-app && cd my-electron-app
npm init -y
npm i --save-dev electron
main.js代码:
const { app, BrowserWindow } = require('electron') function createWindow () { const win = new BrowserWindow({ 800, height: 600, webPreferences: { nodeIntegration: true } }) win.loadFile('index.html') } app.whenReady().then(createWindow) app.on('window-all-closed', () => { if (process.platform !== 'darwin') { app.quit() } }) app.on('activate', () => { if (BrowserWindow.getAllWindows().length === 0) { createWindow() } })
index.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World!</title> <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" /> </head> <body style="background: white;"> <h1>Hello World!</h1> <p> 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>. </p> </body> </html>
package.json
{ "name": "my-electron-app", "version": "1.0.0", "description": "", "main": "main.js", "scripts": { "start": "electron ." }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "electron": "^11.2.2" } }
启动:npm start 命令行