docs : add `electron-auto-update` docs

README.md

@@ -70,6 +70,11 @@ export default {
 }
 ```
 
+## 🔧Additional features
+
+1. electron-auto-update([read it docs](src/components/update/README.md));
+1. playwright;
+
 ## ❔ FAQ
 
 - [dependencies vs devDependencies](https://github.com/electron-vite/vite-plugin-electron-renderer#dependencies-vs-devdependencies)

README.zh-CN.md

@@ -67,7 +67,12 @@ export default {
 }
 ```
 
-## FAQ
+## 🔧额外的功能
+
+1. Electron自动更新([阅读文档](src/components/update/README.zh-CN.md));
+2. Playwright测试;
+
+## ❔ FAQ
 
 - [dependencies vs devDependencies](https://github.com/electron-vite/vite-plugin-electron-renderer#dependencies-vs-devdependencies)
 - [C/C++ addons, Node.js modules - Pre-Bundling](https://github.com/electron-vite/vite-plugin-electron-renderer#dependency-pre-bundling)

src/components/update/README.md

@@ -0,0 +1,47 @@
+# electron-auto-update
+
+English | [简体中文](README.zh-CN.md)
+
+Use `electron-updater` to realize the update detection, download and installation of the electric program.
+
+```sh
+npm i electron-updater
+```
+
+### Main logic
+
+1. ##### Configuration of the update the service address and update information script:
+
+   Add a `publish` field to `electron-builder.json5` for configuring the update address and which strategy to use as the update service.
+
+   ```json
+     publish:{ 
+       provider: 'generic', 
+       channel: 'latest',
+       url: 'https://github.com/xxxx/',
+     }
+   ```
+
+   For more information, please refer to : [electron-builder.json5...](https://github.com/electron-vite/electron-vite-react/blob/2f2880a9f19de50ff14a0785b32a4d5427477e55/electron-builder.json5#L38)
+
+2. ##### The update logic of Electron:
+
+   - Checking if an update is available;
+   - Checking the version of the software on the server;
+   - Checking if an update is available;
+   - Downloading the new version of the software from the server (when an update is available);
+   - Installation method;
+
+   For more information, please refer to  : [update...](https://github.com/electron-vite/electron-vite-react/blob/main/electron/main/update.ts)
+
+3. ##### Updating UI pages in Electron:
+
+   The main function is to provide a UI page for users to trigger the update logic mentioned in (2.) above. Users can click on the page to trigger different update functions in Electron.
+   
+   For more information, please refer to : [components/update...](https://github.com/electron-vite/electron-vite-react/blob/main/src/components/update/index.tsx)
+
+---
+
+Here it is recommended to trigger updates through user actions (in this project, Electron update function is triggered after the user clicks on the "Check for updates" button).
+
+For more information on using `electron-updater` for Electron updates, please refer to the documentation : [auto-update](https://www.electron.build/.html)

src/components/update/README.zh-CN.md

@@ -0,0 +1,49 @@
+# electron-auto-update
+
+[English](README.md) | 简体中文
+
+使用`electron-updater`实现electron程序的更新检测、下载和安装等功能。
+
+```sh
+npm i electron-updater
+```
+
+### 主要逻辑
+
+1. ##### 更新地址、更新信息脚本的配置
+
+   在`electron-builder.json5`添加`publish`字段,用来配置更新地址和使用哪种策略作为更新服务
+
+``` json
+  publish:{ 
+    provider: 'generic',  //提供者、提供商
+    channel: 'latest',//生成yml文件的名称
+    url: 'https://github.com/xxxx/',//更新地址
+  }
+```
+
+更多见 : [electron-builder.json5...](xxx)
+
+2. ##### Electron更新逻辑
+
+   - 检测更新是否可用；
+
+   - 检测服务端的软件版本；
+
+   - 检测更新是否可用；
+
+   - 下载服务端新版软件（当更新可用）；
+   - 安装方式；
+
+  更多见 : [update...](https://github.com/electron-vite/electron-vite-react/blob/main/electron/main/update.ts)
+
+3. ##### Electron更新UI页面
+
+    主要功能是：用户触发上述(2.)更新逻辑的UI页面。用户可以通过点击页面触发electron更新的不同功能。
+    更多见 : [components/update.ts...](https://github.com/electron-vite/electron-vite-react/tree/main/src/components/update/index.tsx)
+
+---
+
+这里建议更新触发以用户操作触发（本项目的以用户点击 **更新检测** 后触发electron更新功能）
+
+关于更多使用`electron-updater`进行electron更新，见文档：[auto-update](https://www.electron.build/.html)