使用HTML-CSS-JS-electron框架创建桌面应用程序(note)

编写一个简单的应用程序，监视CPU使用情况

准备工作

开始之前，安装node.js和git

开始

为项目创建空的文件夹
进入到文件夹打开git bash

1.使用npm install命令安装electron

npm install electron -g

2.安装electron Forge

npm install create-electron-app -g

3.安装完成后键入createelectron创建一个项目,项目名称叫cool-app

create-electron-app cool-app

4.创建完成后，项目文件夹会有框架代码，使用 npm run start 运行应用程序

cd cool-app
npm run start

5.使用编辑器打开

进入到 src文件夹下，使用VScode打开
index.js 这是应用程序的主要逻辑

6.使用任何node.js模块或者JS库，先进行安装

npm install os-utils

7.在index.js中编辑以下代码

const os = require('os-utils');

os.cpuUsage(function(v){
   
	console.log('CPU Usage (%): ' + v*100);
	mainWindow.webContents.send('cpu', v*100);//使用mainWindow.webContents中的send()方法发送数据。可以对他进行命名，以便在渲染器进程中正确接收他们
	console.log('Mem Usage (%): ' + os.freememPercentage()*100);
	mainWindow.webContents.send('mem', os.freememPercentage()*100);
	console.log('Total Mem (%): ' + os.totalmem()/1024);
	mainWindow.webContents.send('total-mem', os.totalmem()/1024);
}