系列
Electron + Vue3开源跨平台壁纸工具实战（二）本地运行
Electron + Vue3开源跨平台壁纸工具实战（三）主进程
Electron + Vue3开源跨平台壁纸工具实战（四）主进程-数据管理（1）
Electron + Vue3开源跨平台壁纸工具实战（五）主进程-数据管理（2）
# Electron + Vue3开源跨平台壁纸工具实战（六）子进程服务
源码
省流点我进Github获取源码，欢迎fork、star、PR
目录结构
Flying-Bird-Wallpaper/
├── .github/ # GitHub工作流配置
├── .vscode/ # VS Code编辑器配置
├── build/ # 构建相关资源
│ ├── Flying-Bird-Wallpaper.iss # Windows安装程序脚本
│ ├── entitlements.mac.plist # macOS权限配置
│ └── icon.* # 应用图标文件
├── docs/ # 项目文档
├── resources/ # 资源文件
│ ├── api/ # API集成模块
│ │ ├── bing.mjs # Bing壁纸API
│ │ ├── nasa.mjs # NASA图片API
│ │ ├── pexels.mjs # Pexels API
│ │ ├── pixabay.mjs # Pixabay API
│ │ ├── unsplash.mjs # Unsplash API
│ │ └── birdpaper.mjs # Birdpaper API
│ ├── icons/ # 应用图标资源
│ ├── lib/ # 原生库文件
│ └── plugin-templates/ # 插件模板
├── scripts/ # 构建脚本
├── src/ # 源代码
│ ├── common/ # 共享代码
│ │ ├── config.js # 配置文件
│ │ └── publicData.js # 公共数据
│ ├── h5/ # H5网页版代码
│ │ ├── api/ # H5请求API
│ │ ├── assets/ # H5静态资源
│ │ ├── components/ # H5组件
│ │ ├── pages/ # H5页面
│ │ ├── stores/ # 状态管理
│ │ └── main.js # H5入口文件
│ ├── i18n/ # 国际化
│ │ ├── locale/ # 语言文件
│ │ ├── i18next.js # i18next配置
│ │ ├── server.js # 服务端i18n
│ │ └── web.js # 网页端i18n
│ ├── main/ # Electron主进程
│ │ ├── child_server/ # 子进程服务
│ │ ├── jobs/ # 定时任务
│ │ ├── store/ # 数据存储
│ │ ├── utils/ # 工具函数
│ │ ├── ApiBase.js # API基类
│ │ ├── cache.mjs # 缓存管理
│ │ ├── logger.mjs # 日志系统
│ │ ├── updater.mjs # 自动更新
│ │ └── index.mjs # 主进程入口
│ ├── preload/ # 预加载脚本
│ └── renderer/ # 渲染进程
│ ├── assets/ # 前端资源
│ ├── components/ # UI组件
│ ├── stores/ # 状态管理
│ ├── utils/ # 工具函数
│ └── windows/ # 窗口管理
├── electron.vite.config.mjs # Electron Vite配置
├── h5.vite.config.mjs # H5 Vite配置
├── electron-builder.yml # 应用打包配置
├── package.json # 项目依赖
└── README.md # 项目说明
命令
package.json中命令介绍
"scripts": {
// 基础命令：清理out、dist目录，需安装rimraf包
"clean": "rimraf out dist",
// 功能命令：使用 prettier 格式化所有文件
"format": "prettier --write .",
// 功能命令：使用 eslint 检查并修复代码问题
"lint": "eslint . --ext .js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",
// 基础命令：用于监听H5前端改动后自动打包
"build:h5_watch": "vite build --config h5.vite.config.mjs --watch",
// 基础命令：仅打包H5前端
"build:h5": "vite build --config h5.vite.config.mjs",
// 功能命令：本地预览应用
"preview:app": "npm run clean && npm run build:h5 && electron-vite preview",
// 功能命令：本地预览应用win
"preview:app_win": "chcp 65001 && npm run clean && npm run build:h5 && electron-vite preview",
// 功能命令：本地开发应用，同步启动H5前端监听打包
"dev": "concurrently -k \"npm run build:h5_watch\" \"electron-vite dev\"",
// 功能命令：本地开发应用win，同步启动H5前端监听打包
"dev:win": "chcp 65001 && concurrently -k \"npm run build:h5_watch\" \"electron-vite dev\"",
// 基础命令：打包应用，仅打包APP，不打包H5前端
"build:app": "electron-vite build",
// 功能命令：清除dist，并打包H5和APP
"build": "npm run clean && npm run build:h5 && npm run build:app",
// 基础命令：从新编译sqlite
"rebuild": "electron-rebuild -f -w better-sqlite3",
// 基础命令：安装 Electron 应用依赖
"postinstall": "electron-builder install-app-deps",
// 功能命令：更新版本号
"version": "node scripts/set-version.js",
// 功能命令：生成未打包的应用程序目录
"build:unpack": "npm run build && electron-builder --dir",
// 功能命令：构建各平台的安装包
"build:win": "npm run build && electron-builder --win",
"build:mac": "npm run build && electron-builder --mac",
"build:linux": "npm run build && electron-builder --linux"
}
本地运行
Clone
git clone https://github.com/OXOYO/Flying-Bird-Wallpaper
Install
$ npm install
Development
$ npm run dev
// Windows下如果控制台乱码可以运行如下命令
$ npm run dev:win
如下启动成功：
本地打包
# For windows
$ npm run build:win
# For macOS
$ npm run build:mac
# For Linux
$ npm run build:linux
可以通过如上命令，生成对应系统的安装包
