bonus
/
eme_small_desk
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
eme_small_desk/ELECTRON_README.md

2.4 KiB
Raw Blame History

Electron 桌面应用配置说明

本项目已配置为支持 Electron 桌面应用，可以将 Vue.js 应用打包成跨平台的桌面应用。

已安装的依赖

  • electron: Electron 框架
  • electron-builder: 用于打包和分发 Electron 应用
  • wait-on: 等待服务启动
  • concurrently: 并行运行多个命令
  • cross-env: 跨平台环境变量设置

可用的脚本命令

开发模式

# 启动Electron开发模式（同时启动Vue开发服务器和Electron）
pnpm run electron:dev

构建和打包

# 构建所有平台的安装包
pnpm run electron:build

# 仅构建Windows安装包
pnpm run electron:build:win

# 仅构建macOS安装包
pnpm run electron:build:mac

# 仅构建Linux安装包
pnpm run electron:build:linux

# 构建但不发布
pnpm run electron:dist

# 仅打包（不创建安装包）
pnpm run electron:pack

文件结构

├── electron/
│   └── main.js          # Electron主进程文件
├── dist/                # Vue构建输出目录
├── dist-electron/       # Electron打包输出目录
└── package.json         # 包含Electron配置

配置说明

Electron 主进程 (electron/main.js)

  • 创建应用窗口
  • 设置窗口属性（大小、图标等）
  • 处理菜单和快捷键
  • 管理应用生命周期

Package.json 配置

  • main: 指定 Electron 主进程文件
  • build: electron-builder 配置
    • 应用 ID 和名称
    • 输出目录
    • 平台特定配置
    • 安装包配置

Vue 配置

  • 根据环境变量调整 publicPath
  • 支持 Electron 和 Web 两种部署方式

使用说明

  1. 开发模式：

    pnpm run electron:dev

    这将启动 Vue 开发服务器，然后启动 Electron 应用。

  2. 生产构建：

    pnpm run electron:build:win

    构建完成后，安装包将位于 dist-electron 目录中。

注意事项

  • 确保在构建前先运行 pnpm run build:prod 构建 Vue 应用
  • 不同平台的构建需要对应的系统环境
  • 图标文件路径为 public/favicon.ico
  • 应用名称：流程自动化机器人

故障排除

如果遇到问题，请检查：

  1. Node.js 版本是否兼容
  2. 所有依赖是否正确安装
  3. 端口 8080 是否被占用（开发模式）
  4. 构建输出目录权限是否正确