前言
做了十年前端，手里常年揣着Mac，团队却要天天交付Windows版Electron测试包。
相信很多前端同行都踩过这个坑：手里没有Windows设备、本地搭交叉打包环境一堆报错、wine配置繁琐还容易炸、每次打包都要麻烦同事代打，测试催包的时候恨不得当场换电脑。
这篇纯实战干货，彻底解决无Windows设备的Electron打包痛点：用GitLab CI云端流水线，把Windows打包全丢给云服务器，代码提交/打Tag自动构建，飞书推送成品包下载链接，测试直接拿包即用，全程不用碰Windows电脑，零本地环境折腾。
一、场景痛点：为什么无Windows设备，必须用GitLab CI？
- 摆脱Windows硬件依赖：Mac/Linux设备直接躺平，不用装虚拟机、不用配wine交叉编译环境
- 环境绝对统一：云端原生Windows runner，彻底告别本地交叉打包的玄学兼容问题
- 解放双手自动化：提交代码/打版本Tag自动触发构建，不用守着控制台、不用求人代打包
- 测试交付零成本：打包成功才推飞书，附带成品包直链，测试不用蹲守页面
- 构建可追溯：每次打包日志、产物全留存，版本回溯一目了然，排查问题更高效
- 内网友好：企业内部GitLab更稳定，不受外网限制，依赖下载更快
前提：项目已接入electron-builder（别用electron-packager，跨平台兼容性差、配置不灵活，十年前端血的教训）。
二、前置准备：项目基础配置（Mac/Linux直接搞定）
这一步全程在你当前的Mac/Linux环境操作，不用碰Windows，把打包脚本和builder配置写对就行。
1. 安装依赖
# 安装核心依赖
npm i electron electron-builder -D
# 建议锁死版本，避免云端构建拉取最新版导致兼容异常
npm i electron@28.2.0 electron-builder@24.13.0 -D
2. package.json核心配置（云端打包关键）
重点盯scripts和build字段，云端CI会直接调用build:win脚本，路径、配置写错直接构建失败。
{
"name": "electron-demo",
"version": "1.0.0",
"main": "main.js",
"scripts": {
"start": "electron .",
// 云端Windows打包命令，固定写法，禁止随意修改
"build:win": "electron-builder --win --x64"
},
"build": {
"appId": "com.xxx.electron-demo",
"productName": "Electron测试包",
"directories": {
// 打包产物输出目录，云端上传以此为基准
"output": "dist"
},
"win": {
// 同时生成exe安装包+zip绿色包，适配测试两种场景
"target": [
{ "target": "nsis", "arch": ["x64"] },
{ "target": "zip", "arch": ["x64"] }
],
// 可选：应用图标，放在项目build/icon.ico，无图标可删除该行
"icon": "build/icon.ico"
},
"nsis": {
// 测试包建议开启自定义安装路径，更贴合测试场景
"oneClick": false,
"allowToChangeInstallationDirectory": true,
"createDesktopShortcut": true
},
// 开启最大压缩，减小产物体积，加快下载速度
"compression": "maximum"
},
"devDependencies": {
"electron": "^28.2.0",
"electron-builder": "^24.13.0"
}
}
三、核心实战：GitLab CI配置（无Windows专属）
GitLab CI的核心是根目录配置文件： .gitlab-ci.yml，文件名固定、大小写敏感，全程在Mac/Linux创建文件即可，不用Windows环境。
提前准备：GitLab仓库已配置Windows Runner（shared runner或私有runner，标记windows标签），变量配置好PFX_CERT_BASE64、PFX_CERT_PASSWORD、FEISHU_WEBHOOK_URL。
完整CI配置（无Windows踩坑优化版，含签名+飞书成品包推送）
# 全局配置
stages:
- install
- build
- upload
- notify
# 缓存node_modules，加速构建
cache:
paths:
- node_modules/
key:
files:
- package-lock.json
prefix: $CI_PROJECT_ID
# 安装依赖阶段
install_deps:
stage: install
tags:
- windows # 必须绑定Windows runner标签
only:
- main
- dev
- /^v\d+.\d+.\d+$/ # 版本Tag触发
script:
- npm config set registry https://registry.npmmirror.com # 修复镜像解析报错
- npm ci
# Windows打包+正式版代码签名阶段
build_win:
stage: build
tags:
- windows
only:
- main
- dev
- /^v\d+.\d+.\d+$/
dependencies:
- install_deps
script:
# 执行打包
- npm run build:win
# 正式版Tag执行代码签名，修复时间戳服务地址
- |
if ($CI_COMMIT_TAG -match '^v\d+.\d+.\d+$') {
choco install signtool -y
$pfxBytes = [Convert]::FromBase64String($env:PFX_CERT_BASE64)
[IO.File]::WriteAllBytes("$CI_PROJECT_DIR/code-sign.pfx", $pfxBytes)
signtool sign /f "$CI_PROJECT_DIR/code-sign.pfx" /p "$env:PFX_CERT_PASSWORD" /tr http://timestamp.sectigo.com /td SHA256 /fd SHA256 dist/*.exe
signtool verify /pa dist/*.exe
}
artifacts:
# 打包成品包归档，测试直接下载
name: "electron-windows-build"
paths:
- dist/*.exe
- dist/*.zip
expire_in: 7 days # 产物有效期，避免占用空间
# 归档产物（可选，配合Release）
upload_release:
stage: upload
tags:
- windows
only:
- /^v\d+.\d+.\d+$/
dependencies:
- build_win
script:
- echo "正式版本产物已归档，可用于发版"
# 核心：仅打包成功推送飞书，发送成品包链接
feishu_notify:
stage: notify
tags:
- windows
only:
- main
- dev
- /^v\d+.\d+.\d+$/
when: on_success # 只有构建成功才推送，失败不扰民
script:
- |
$webhook = "$env:FEISHU_WEBHOOK_URL"
$body = @{
msg_type = "interactive"
card = @{
config = @{
wide_screen_mode = $true
}
elements = @(
@{
tag = "div"
text = @{
content = "📦 **Electron Windows 测试包已打好**`n✅ 打包状态：成功`n🔖 分支/Tag：$CI_COMMIT_REF_NAME`n📝 提交信息：$CI_COMMIT_MESSAGE`n🔗 **成品包直链**：$CI_PROJECT_URL/-/jobs/$CI_JOB_ID/artifacts/download`nℹ️ 说明：内含exe安装包+zip免安装包，直接下载解压即用"
tag = "lark_md"
}
}
)
}
} | ConvertTo-Json -Depth 10
Invoke-RestMethod -Uri $webhook -Method Post -Body $body -ContentType "application/json"
四、测试人员操作指南：下载+运行一步到位
方式1：飞书一键下载成品包（推荐）
- 只有打包完全成功时，测试群才会收到飞书卡片通知，杜绝失败通知刷屏
- 点击通知里的成品包直链，一键下载压缩包（无需登录GitLab或跳转页面）
- 解压后直接使用：exe为安装版、zip为免安装绿色版，开箱即测
方式2：GitLab手动下载
- 打开GitLab仓库 → CI/CD → Jobs
- 找到最新的build_win任务 → 点击右侧Download下载产物
五、无Windows打包：避坑指南（含测试侧实操）
全流程避坑（Mac开发者+测试人员双视角）
1. 云端依赖安装超时/失败
已修复镜像地址为**registry.npmmirror.com**（原地址解析报错），云端走国内源，稳定不超时；仍报错可检查runner网络或配置内网代理。
2. 测试运行报错：Windows Defender报毒/拦截
测试包未签名属于正常误报，直接把这套步骤丢给测试，不用远程协助：
测试侧实操：放行文件+关闭防火墙（分步版）
- 放行隔离文件：打开Windows Defender安全中心 → 病毒和威胁防护 → 保护历史记录 → 找到被拦截的exe/zip → 选择允许
- 添加文件夹白名单：Windows Defender安全中心 → 病毒和威胁防护 → 管理设置 → 排除项 → 添加排除项 → 选择解压后的文件夹
- 临时关闭防火墙（可选） ：设置 → 更新和安全 → Windows安全中心 → 防火墙和网络保护 → 点击当前网络 → 关闭防火墙（测试完建议重新开启）
- 兜底方案：优先使用zip绿色版，解压后直接运行，避开安装包签名校验
正式版根治方案
购买OV代码签名证书（PFX格式），将证书base64编码、密码存入GitLab仓库变量，CI打Tag时自动签名，彻底解决报毒问题，无Windows设备也能完成。
3. 云端构建成功，但无产物/下载失败
- 检查package.json中output目录是否为dist，路径写错会导致找不到产物
- 核对build:win脚本是否正确，本地执行npm run build:win（Mac/Linux会报错，但能校验脚本语法）
- 确认artifacts.paths路径匹配dist下的exe、zip文件，权限配置正确
4. 打包体积过大/下载慢
在build字段添加files白名单，只打包核心文件，剔除node_modules冗余依赖：
"files": [
"main.js",
"renderer/**/*",
"package.json"
]
5. 云端构建时长过长
- 开启node_modules缓存，大幅减少依赖下载时间
- 限制触发分支，仅main/dev/版本Tag构建，避免全分支打包
- 关闭不必要的target，仅保留nsis和zip两种格式
- 正式版打Tag时再执行签名步骤，日常测试跳过签名环节节省时间
六、进阶优化：无Windows环境也能玩转工程化
- 多架构兼容打包：需兼容32位Windows，把arch改为["x64","ia32"]，云端自动处理
- 自动更新集成：接入electron-updater，云端打包后同步生成更新清单
- 多平台同步打包：追加Mac/Linux构建任务，一套CI打全平台包，全程不用换设备
- 产物加密：敏感项目给压缩包加密码，CI集成加密脚本，提升安全性
七、总结
做前端越久越清楚：工程化的核心是解决场景痛点，而非堆砌技术。
针对无Windows设备的Electron打包场景，这套GitLab CI方案企业级落地性极强，彻底摆脱了虚拟机、wine、代打包的低效循环，Mac党全程不用碰Windows。搭配打包成功才推送飞书、测试侧标准化放行步骤，交付效率直接拉满。
配置直接复制粘贴，遇到问题看CI日志、核对路径，基本都是细节问题，零门槛落地。
同为无Windows设备的前端人，建议赶紧把这套流程架起来，告别打包焦虑，把时间花在正经开发上。
作者简介：十年前端老码农，Mac重度用户，专注跨端工程化、CI/CD落地，拒绝水文，只更实战干货。
