Electron学习笔记,安装环境(1)

1、支持win7的Electron 的版本是18,这里node.js用的是14版本(node-v14.21.3-x86.msi)云盘有安装包

Electron 18.x (截至2023年仍在维护中):

Chromium: 96

Node.js: 14.17.0

2、安装node环境,node-v14.21.3-x86.msi双击运行选择安装位置,都是下一步

成功后node和npm都已经安装好了

3、新建文件夹,用来放项目文件

运行

php 复制代码
npm init

然后一路回车

4、配置npm使用阿里云镜像

首先,你需要设置npm的registry为阿里云的镜像。你可以通过以下命令来配置:

php 复制代码
npm config set registry https://registry.npmmirror.com

5、安装electron18 版本文件内容

php 复制代码
npm install electron@18.0.0 --save-dev


然后这里面有了一堆文件,就是安装electron成功了,否则就重新运行 install 命令,

6、文件配置

package.json

javascript 复制代码
{
  "name": "eledemo",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "electron": "^18.0.0"
  }
}

main.js

javascript 复制代码
const { app, BrowserWindow ,Menu  } = require('electron')

const createWindow = () => {
  const win = new BrowserWindow({
    width: 800,
    height: 600
  })
// 把顶部自带的默认菜单去掉设置为null
  Menu.setApplicationMenu(null)
  win.loadFile('index.html')
}

app.whenReady().then(() => {
  createWindow()
})

7、运行程序

php 复制代码
npm start

demo 程序运行成功

相关推荐
优选资源分享8 小时前
PicGo v3.0.3 新版 | 开源免费图床工具
javascript·笔记·electron
星恒随风9 小时前
Linux线程概念详解:从分页存储、页表、MMU与TLB,深入理解线程和进程的区别与联系
linux·运维·笔记·学习·状态模式
qq_284274059 小时前
数控机床编程基础与坐标系:编程六步流程、程序号/程序段/程序字格式,与右手定则下车床铣床XYZ轴判定(含考点)
笔记·学习·自动化·制造
德林恩宝9 小时前
On-Policy Distillation(OPD)学习文档
人工智能·学习·机器学习·大模型·llm·大模型微调
问心无愧05139 小时前
[SUCTF 2019]EasySQL
笔记
ss27310 小时前
PG实战笔记 | 09 PostgreSQL psql客户端基本操作
数据库·笔记·postgresql
xxwl58510 小时前
区域赛分类题解
c++·笔记·学习·算法
不可能片场12 小时前
Electron 发布核验 别把没查到当成没发出去
前端·electron
flash俊杰12 小时前
桌宠点击反应:把一坨 if 拆成「归一化 → 门控查表 → 执行 → 广播」
electron
成都蜀味缘餐饮技术培训学校13 小时前
油炸串串技术培训实战指南,核心食材选购与预处理标准
数据仓库·经验分享·笔记·课程设计·微信公众平台