1、安装nodejs

2、安装yarn（替代nodejs自带的npm）

node install -g yarn

3、新建一个文件夹，命名为test

4、在上一步创建的文件夹目录下打开终端，创建nodejs项目，并且根据提示输入项目信息：

{ name:test version:1.0.0 entry point:index.js license:MIT }

5、将安装源切换为国内资源，安装electron依赖包：选择版本7.2.4

yarn config set ELECTRON_MIRROR https://.npm.taobao.org/dist/electron yarn add electron@7.2.4 --platform=win64

6、如果上一步安装失败，也可以手动修改package.json文件

{ "name": "test", "version": "1.0.0", "main": "index.js", "author": "", "license": "MIT", "dependencies": { "electron": "^7.2.4", "electron-log": "^2.2.14", "electron-settings": "^3.0.7", "electron-shortcut-normalizer": "^1.0.0", "glob": "^7.1.0", "highlight.js": "^10.4.1", "update-electron-app": "^1.1.1" } }

然后执行命令

npm install

至此，在文件夹test下即可看到依赖包文件夹node_modules

7、在package中增加启动入口：

"scripts": {"start":"electron ./index.js"}

8、在test文件夹目录下创建文件index.js，并输入如下代码：

// / // electron const {app, BrowserWindow} = require('electron'); // 保持对window对象的全局引用，如果不这么做的话，当JavaScript对象被 // 垃圾回收的时候，window对象将会自动的关闭 let win; function createWindow() { // 创建浏览器窗口。 win = new BrowserWindow({ width: 1200, height: 600, webPreferences: { nodeIntegration: true, // 集成node环境 enableRemoteModule: true }, }); // 加载index.html文件 win.loadFile('./index.html'); win.on('closed', () => { win = null; }); } // Electron 会在初始化后并准备 // 创建浏览器窗口时，调用这个函数。 // 部分 API 在 ready 事件触发后才能使用。 app.on('ready', createWindow); // 当全部窗口关闭时退出。 app.on('window-all-closed', () => { // 在 macOS 上，除非用户用 Cmd + Q 确定地退出， // 否则绝大部分应用及其菜单栏会保持激活。 if (process.platform !== 'darwin') { app.quit(); } }); app.on('activate', () => { // 在macOS上，当单击dock图标并且没有其他窗口打开时， // 通常在应用程序中重新创建一个窗口。 if (win === null) { createWindow(); } }); // 在这个文件中，你可以续写应用剩下主进程代码。 // 也可以拆分成几个文件，然后用 require 导入。 //

9、在test文件夹目录下创建文件index.html，并输入如下代码：

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World!</title> </head> <body> <h1>Hello World!</h1> <span>We are using node Chrome and Electron</span> </body> </html>

10、执行命令

yarn start

11、如下是运行成功的界面

原文链接：https://blog.csdn.net/h8062651/article/details/122731032?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522165934461816782246452974%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=165934461816782246452974&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-4-122731032-null-null.nonecase&utm_term=%E6%90%AD%E5%BB%BA