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 程序运行成功

相关推荐
无敌贵点大王9 分钟前
RTThread学习记录11——RT-Thread 设备模型吃透:UART/ADC/PWM/PIN 到底有什么区别?
c语言·stm32·学习·链表
是翎2 小时前
深度长文|2026产品经理AI实践手册
人工智能·深度学习·学习·自然语言处理·数据挖掘
Linux-lucky2 小时前
32-38-Linux学习之旅之MySQL综合
linux·运维·学习·mysql·ubuntu
知识分享小能手3 小时前
C++ 学习教程,从入门到精通,C++ 入门知识 — 完整知识点(1)
开发语言·c++·学习
马可家的菠萝4 小时前
你收藏的资料,有多少真的被你第二次打开过?
笔记·知识管理·效率提升·个人知识库
小刘在重生~5 小时前
Java Lock 显式锁案例|ReentrantLock 解决多线程安全问题(超详细实战)
java·笔记·面试
职豚求职小程序5 小时前
中国人寿27秋招笔试[特殊字符]北森机考|备考攻略
笔记
江湖人称菠萝包5 小时前
【Qt】《Qt 5.9 C++开发指南》笔记-Chapter9-Qt Charts
笔记·qt·qt5
乐橙开放平台5 小时前
从「多套客户端」到一套开放能力:乐橙视频监控能力复盘
笔记·物联网·自动化·音视频·智能家居
AI职业加油站6 小时前
数据要素价值释放年:大数据治理工程师,站上职业新风口
人工智能·学习·职场和发展·数据分析·职场发展