electron打包基本教程

概要

将html打包成桌面的主流有electron和nwjs，nwjs更加简单，但是使用效果不如electron，electron打包比较麻烦，但是效果比较好，反正各有优势和缺点

步骤

基础软件

1. nodejs
   官网下载
   阿里下载

# 验证版本
node -v
v22.13.0

2. npm
   nodejs自带npm，直接查看版本

npm -v
10.9.2

3. cnpm
   国内用户需安装这个，你懂的

#使用 npm 全局安装 cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org

4. 生成项目

• 创建目录 my-electron-app
• 进入目录，命令创建

cnpm init -y
# -y 参数表示使用默认配置快速初始化，免去手动回答一系列问题的步骤。

5. 添加依赖

# 用于开发
cnpm install electron --save-dev
# 用于打包
cnpm install electron-builder --save-dev

6. 指定国内地址
   打包时会到github下载很多文件，如果连接github不顺畅，可以指定国内地址

  "build": {
   
  	"electronDownload": {
   
  	  "mirror": "https://registry.npmmirror.com/-/binary/electron/"
  	},
    "appId": "com.cn.app",
    "mac": {
   
      "target": "dmg"
    }