写在前面

已经有了那么多的 Electron 项目模板，为什么还要再造一个？是重复造轮子吗？

我相信大多数人选择使用 Electron 开发客户端时，或多或少都看上了 Web 开发的高效率，但Web开发人员在客户端和系统编程方面的经验相对缺乏，又加上 Electron 和前端框架（如 Vue ）结合起来也不是那么的轻而易举，开发人员大多会选择基于模板来快速上手搭建Electron项目。

目前，Electron 的模板项目已经有很多，比较流行的有electron-vite、electron-vite-vue等。在这些模板中，有的功能过于完善，代码太复杂，远远超过了很多 Electron 客户端项目本身的代码量，需要花很多时间来熟悉模板，不适合新手快速上手和修改，一旦出现问题也难以维护；有的模板又年久失修，使用的技术早已被淘汰，也不适合用来开发线上产品，而且这些模板都有一个通病，都是在用Web开发的思维来开发客户端。

基于上述原因，我开发了这个 Electron 项目模板，在开发过程中，我一直遵循稳定、易于维护的初衷。

项目地址：
https://github.com/winsoft666/electron-vue3-boilerplate

项目介绍

基于Vue3 + Electron + TypeScript的客户端程序模板，使用Vite和Electron Forge构建和打包。

真正做到开箱即用，面向跨平台客户端设计，产品级的项目模板。

特性

使用 ViteJS 构建和驱动前端页面，支持热加载（HMR），使开发和调试变得更加高效 ⚡
支持Electron窗口创建指令，并且可隔离不同窗口的IPC事件 💖
封装简化了IPC的调用方式，并提供了IPC函数快速创建指令，主进程与渲染进程的相互调用从未如此简单 👍
主进程和渲染进程支持热加载 ⚡
精选依赖包，提升项目稳定性
代码简洁，易掌控，可定制性强
日志文件，主进程和渲染进程可以直接写文件日志
配置文件
主进程和渲染进程均支持axios HTTP请求
文件下载（含哈希校验、进度反馈），渲染进程可直接异步调用 👍
功能完善的无边框窗口
托盘图标和右键菜单，窗口关闭时程序最小化到托盘
客户端程序单实例
基于ESLint的代码规范和自动格式化
使用Electron官方推荐的Electron Forge进行客户端构建和打包
支持NSIS安装包 😎
……

快速开始 🌈

点击右上角绿色的 Use this template 按钮，使用该模板创建一个新的仓库并克隆到本地。

或者..

直接克隆该项目:

1	git clone https://github.com/winsoft666/electron-vue3-boilerplate.git

Visual Studio Code

推荐使用Visual Studio Code进行项目开发，并安装如下插件：

ESLint
Vue Language Features (Volar)

安装依赖 ⏬

1	yarn install

开发 ⚒️

1	yarn run dev

其他命令

yarn run dev # 启动应用并支持热加载
yarn run build # 构建应用，可发布的包位于"out\make"目录

# 或者
yarn run build:win32 # 构建Windows平台 32位应用
yarn run build:win64 # 构建Windows平台 64位应用
yarn run build:mac # 构建macOS平台应用
yarn run build:linux # 构建Linux平台应用

yarn run new:page  # 创建新的Vue页面
yarn run new:window # 创建新的Electron窗口