新建Electron项目
一、环境配置
Node.js是什么
官网给出的解释为:
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时。
Node.js® is a JavaScript runtime built on [Chrome's V8 JavaScript engine](https://v8.dev/).
百度百科给出的答案:
Node 是一个让 JavaScript 运行在服务端的开发平台,它让 JavaScript 成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。 发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装。
Node对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。V8引擎执行Javascript的速度非常快,性能非常好。Node是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node 使用事件驱动, 非阻塞I/O模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。
安装Node.js
说说普通安装就好,去Node.js官网下载msi文件,双击自己安装吧。

安装好之后,检查是否安装成功
node -v

NPM是什么
NPM的全称是Node Package Manager,,是Nodejs的包管理器,随同Node.js一同安装。
npm -v

二、新建Electron项目
Electron项目其实就是一个Node.js App,他们模块相同。一个最基本的Electron项目文件目录包含三个文件

1.新建项目
创建一个新文件夹,打开命令行工具,cd进文件夹中运行npm init
npm init
2.在package.json中添加启动脚本
原package.json内容

修改后内容

3.安装Electron
将Electron当作App中的开发依赖项,这样可以在不同的App中使用不同的Electron版本,在项目文件夹中输入命令
npm install --save-dev electron
4.修改main.js文件
const { app, BrowserWindow } = require('electron')
functioncreateWindow(){
// 创建浏览器窗口
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true }
})
// 加载index.html文件
win.loadFile('index.html')
}
app.whenReady().then(createWindow)
5.编辑index.html
按自己意愿编辑index.html内容
6.启动应用
npm start