最近接到了新需求，做一个windows桌面应用程序,于是采用了electron 开发框架，对于已经熟悉Web开发技术且想要快速构建桌面应用程序，electron是个不错的选择。
Electron由三大部分组成：
chromium：UI界面
node.js：拥有操作底层的能力，比如C++
Native API：跨平台原生的能力，比如：窗口托盘、文件系统访问，shell等
electron-vite
electron-vite 是一个新型构建工具，旨在为 Electron 提供更快、更精简的开发体验，一套构建指令它使用Vite 打包，能够处理Electron的独特环境，包括Node.js 和浏览器环境，并且集中配置主进程、渲染器和预加载脚本Vite配置
安装
前提条件
electron-vite 需要 Node.js 版本 14.18+ 和 Vite 版本 3.0+
搭建第一个electron-vite项目
使用 npm
npm create @quick-start/electron
使用yarn
yarn create @quick-start/electron
然后按照提示操作即可
✔ Project name: … <electron-app>
✔ Select a framework: › vue
✔ Add TypeScript? … No / Yes
✔ Add Electron updater plugin? … No / Yes
✔ Enable Electron download mirror proxy? … No / Yes
Scaffolding project in ./<electron-app>...
Done.
cd electron-vite-demo
npm install
electron 包在国外，下载得很慢，可以配置以下镜像源
//设置npm镜像源
npm config set registry https://registry.npm.taobao.org
//设置electron镜像
npm config set electron_mirror https://npm.taobao.org/mirrors/electron/
配置好后再使用npm install 就很快了
下载完依赖包后使用npm run dev 就可以看到运行后的效果了
打包
electron-forge 官方实例用的这个打包工具，但是注意它只能打本系统的包，比如我mac电脑要打windows包，是不行的
本项目中已经给我们下载好了electron-builder包，它可以打windows、linux、mac
package.json 中也配置好了
"build:win": "npm run build && electron-builder --win --config",
"build:mac": "electron-vite build && electron-builder --mac --config",
"build:linux": "electron-vite build && electron-builder --linux --config"
比如打一个windows包，执行npm run build:win 就行了，打包完成会生成一个dist文件夹
至此安装打包都完成了
下一篇文章:electron入门使用
