docs: add chinese simplified language support

jooy2 · Dec 24, 2024 · cc03914 · cc03914
1 parent 4fbe5a4
commit cc03914
Show file tree

Hide file tree

Showing 16 changed files with 477 additions and 2 deletions.
diff --git a/docs/src/.vitepress/config.mts b/docs/src/.vitepress/config.mts
@@ -6,7 +6,7 @@ import type { VitePressSidebarOptions } from 'vitepress-sidebar/types'
 import type { VitePressI18nOptions } from 'vitepress-i18n/types'
 
 const capitalizeFirst = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1)
-const supportLocales = ['en', 'ko']
+const supportLocales = ['en', 'ko', 'zhHans']
 const defaultLocale: string = supportLocales[0]
 
 const vitePressI18nConfigs: VitePressI18nOptions = {
@@ -15,7 +15,9 @@ const vitePressI18nConfigs: VitePressI18nOptions = {
   searchProvider: 'local',
   description: {
     en: 'Vutron is a preconfigured template for developing Electron cross-platform desktop apps. It uses Vue 3 and allows you to build a fast development environment with little effort.',
-    ko: 'Vutron은 Electron 크로스 플랫폼 데스크톱 앱 개발을 위해 미리 구성된 템플릿입니다. Vue 3을 사용하며 적은 노력으로 빠른 개발 환경을 구축할 수 있습니다.'
+    ko: 'Vutron은 Electron 크로스 플랫폼 데스크톱 앱 개발을 위해 미리 구성된 템플릿입니다. Vue 3을 사용하며 적은 노력으로 빠른 개발 환경을 구축할 수 있습니다.',
+    zhHans:
+      'Vutron 是用于开发 Electron 跨平台桌面应用程序的预配置模板。它使用 Vue 3，可让您轻松构建快速开发环境。'
   },
   themeConfig: {
     en: {
@@ -33,6 +35,14 @@ const vitePressI18nConfigs: VitePressI18nOptions = {
           link: '/ko/installation-and-build/getting-started'
         }
       ]
+    },
+    zhHans: {
+      nav: [
+        {
+          text: '入门',
+          link: '/zhHans/installation-and-build/getting-started'
+        }
+      ]
     }
   }
 }

diff --git a/docs/src/zhHans/electron-how-to/index.md b/docs/src/zhHans/electron-how-to/index.md
@@ -0,0 +1 @@
+# Electron 操作方法
diff --git a/docs/src/zhHans/electron-how-to/main-and-renderer-process.md b/docs/src/zhHans/electron-how-to/main-and-renderer-process.md
@@ -0,0 +1,25 @@
+# 主流程与渲染器流程
+
+一个**Vutron**应用程序被分为代码，分为主进程和渲染器进程。
+
+**“主”**是`src/main`的代码，主要是由Electron处理的进程代码。**“渲染器”**是`src/renderer`的代码，主要用于前端渲染过程，如Vue。
+
+一般来说，**Node.js**脚本无法在渲染器进程中运行。例如，包含Node.js使用的API的模块，或**Node.js**的本机模块，如`path`或`net`、`os`或`crypto`。
+
+预加载脚本在渲染器加载之前运行。它为主进程创建了一个桥梁，出于安全考虑，将Node.js脚本的执行与渲染器区域分开并隔离。
+
+为了安全执行脚本，建议主进程执行Node脚本，渲染器通过消息传递接收执行结果。这可以通过**IPC通信**来实现。
+
+欲了解更多信息，请参阅以下文章: https://www.electronjs.org/docs/latest/tutorial/ipc
+
+### 如何在渲染器上运行Node.js？
+
+如果您想跳过安全问题并在渲染器中使用 Node.js 脚本，需要在 `vite.config.ts` 文件中将 `nodeIntegration` 设置为 `true`。
+
+```javascript
+rendererPlugin({
+  nodeIntegration: true
+})
+```
+
+欲了解更多信息，请参阅以下文章: https://github.com/electron-vite/vite-plugin-electron-renderer
diff --git a/docs/src/zhHans/electron-how-to/preload-script.md b/docs/src/zhHans/electron-how-to/preload-script.md
@@ -0,0 +1,24 @@
+# 预加载脚本
+
+Electron.js中的预加载脚本是一个安全区域，用于主进程和渲染器进程之间的通信。它通常用于 **[IPC通信](https://www.electronjs.org/docs/latest/tutorial/ipc)**。
+
+更多信息，请参阅以下文章: https://www.electronjs.org/docs/latest/tutorial/tutorial-preload
+
+为了与最新版本的Electron兼容并确保安全，我们不建议使用旧的`electron/remote`模块。如果您想使用系统事件或Node脚本，建议在主进程中使用，而不是在渲染器中。
+
+Vutron的预加载脚本位于`src/preload`文件夹中。要创建新的IPC通信通道，请将通道名称添加到以下变量中，将其列入通信白名单。
+
+- `mainAvailChannels`: 从主程序发送事件到渲染程序。 (`window.mainApi.send('channelName')`)
+- `rendererAvailChannels`: 将事件从渲染器发送到主程序。 (`mainWindow.webContents.send('channelName')`)
+
+当从渲染器向主程序发送事件时，应访问`window.mainApi`对象，而不是`ipcRenderer.send`。`mainApi`是您在自己的Vutron模板中设置的名称，可以更改。
+
+以下是mainApi支持的功能:
+
+- `send`: 将活动发送至主页面。
+- `on`: 一个接收主发送事件的听众。
+- `once`: 接听主叫方发送的事件。（仅处理一个呼叫）
+- `off`: 移除事件监听器
+- `invoke`: 可异步发送事件和接收数据的功能。
+
+要更改和修改此设置，您需要修改 `src/preload/index.ts` 中的 `exposeInMainWorld`。
diff --git a/docs/src/zhHans/index.md b/docs/src/zhHans/index.md
@@ -0,0 +1,32 @@
+---
+layout: home
+
+title: Vutron
+titleTemplate: Vite + Vue 3 + Electron 快速入门模板
+
+hero:
+  name: Vutron
+  text: Vite + Vue 3 + Electron 快速入门模板
+  tagline: <strong>Vutron</strong>是一个用于开发 "Electron" 跨平台桌面应用程序的预配置模板。它使用 "Vue 3"，可让您轻松构建快速开发环境。
+  actions:
+    - theme: brand
+      text: 入门
+      link: /zhHans/installation-and-build/getting-started
+    - theme: alt
+      text: GitHub
+      link: https://github.com/jooy2/vutron
+  image:
+    src: /icon.png
+    alt: Vue
+
+features:
+  - icon: <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.03628 7.87818C4.75336 5.83955 6.15592 3.95466 8.16899 3.66815L33.6838 0.0367403C35.6969 -0.24977 37.5581 1.1706 37.841 3.20923L42.9637 40.1218C43.2466 42.1604 41.8441 44.0453 39.831 44.3319L14.3162 47.9633C12.3031 48.2498 10.4419 46.8294 10.159 44.7908L5.03628 7.87818Z" fill="url(#paint0_linear_1287_1214)"/><path d="M6.85877 7.6188C6.71731 6.59948 7.41859 5.65703 8.42512 5.51378L33.9399 1.88237C34.9465 1.73911 35.8771 2.4493 36.0186 3.46861L41.1412 40.3812C41.2827 41.4005 40.5814 42.343 39.5749 42.4862L14.0601 46.1176C13.0535 46.2609 12.1229 45.5507 11.9814 44.5314L6.85877 7.6188Z" fill="white"/><path d="M33.1857 14.9195L25.8505 34.1576C25.6991 34.5547 25.1763 34.63 24.9177 34.2919L12.3343 17.8339C12.0526 17.4655 12.3217 16.9339 12.7806 16.9524L22.9053 17.3607C22.9698 17.3633 23.0344 17.3541 23.0956 17.3337L32.5088 14.1992C32.9431 14.0546 33.3503 14.4878 33.1857 14.9195Z" fill="url(#paint1_linear_1287_1214)"/><path d="M27.0251 12.5756L19.9352 15.0427C19.8187 15.0832 19.7444 15.1986 19.7546 15.3231L20.3916 23.063C20.4066 23.2453 20.5904 23.3628 20.7588 23.2977L22.7226 22.5392C22.9064 22.4682 23.1021 22.6138 23.0905 22.8128L22.9102 25.8903C22.8982 26.0974 23.1093 26.2436 23.295 26.1567L24.4948 25.5953C24.6808 25.5084 24.892 25.6549 24.8795 25.8624L24.5855 30.6979C24.5671 31.0004 24.9759 31.1067 25.1013 30.8321L25.185 30.6487L29.4298 17.8014C29.5008 17.5863 29.2968 17.3809 29.0847 17.454L27.0519 18.1547C26.8609 18.2205 26.6675 18.0586 26.6954 17.8561L27.3823 12.8739C27.4103 12.6712 27.2163 12.5091 27.0251 12.5756Z" fill="url(#paint2_linear_1287_1214)"/><defs><linearGradient id="paint0_linear_1287_1214" x1="6.48163" y1="1.9759" x2="39.05" y2="48.2064" gradientUnits="userSpaceOnUse"><stop stop-color="#49C7FF"/><stop offset="1" stop-color="#BD36FF"/></linearGradient><linearGradient id="paint1_linear_1287_1214" x1="11.8848" y1="16.4266" x2="26.7246" y2="31.4177" gradientUnits="userSpaceOnUse"><stop stop-color="#41D1FF"/><stop offset="1" stop-color="#BD34FE"/></linearGradient><linearGradient id="paint2_linear_1287_1214" x1="21.8138" y1="13.7046" x2="26.2464" y2="28.8069" gradientUnits="userSpaceOnUse"><stop stop-color="#FFEA83"/><stop offset="0.0833333" stop-color="#FFDD35"/><stop offset="1" stop-color="#FFA800"/></linearGradient></defs></svg>
+    title: 功能强大的网络应用程序开发模板
+    details: Vutron 支持跨平台、多语言、布局和主题以及风格框架。
+  - icon: <svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 80 80" width="160px" height="160px"><path fill="#424e5c" d="M4.5 6.5H75.5V73.5H4.5z"/><path fill="#afc5d8" d="M75,7v66H5V7H75 M76,6H4v68h72V6L76,6z"/><path fill="#afc5d8" d="M4 6H76V18H4z"/><path fill="#bae0bd" d="M25.6 43H54.400000000000006V45H25.6z" transform="rotate(-69.666 39.998 43.999)"/><path fill="#bae0bd" d="M27.9 54.4L16 44 27.9 33.6 29.2 35.1 19 44 29.2 52.9zM52.2 54.5L50.9 53 61 44.1 50.9 35.1 52.2 33.6 64 44.1z"/></svg>
+    title: 通过热加载实现快速开发
+    details: 为开发人员提供最大程度的功能支持，缩短项目初始设置时间。
+  - icon: <svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 32 32" width="64px" height="64px"><circle cx="16" cy="17" r="5" fill="#ed0049"/><path fill="#ed0049" d="M23,31H9v0c0-3.866,3.134-7,7-7h0C19.866,24,23,27.134,23,31L23,31z"/><path fill="#0f518c" d="M19,4c0-1.657-1.343-3-3-3s-3,1.343-3,3c0,0.885,0.391,1.672,1,2.222V10h4V6.222 C18.609,5.672,19,4.885,19,4z"/><path fill="#0f518c" d="M7.061,8.318c-1.171-1.171-3.071-1.171-4.243,0s-1.171,3.071,0,4.243 c0.626,0.626,1.459,0.906,2.278,0.864l2.672,2.672l2.828-2.828l-2.672-2.672C7.967,9.777,7.686,8.944,7.061,8.318z"/><path fill="#0f518c" d="M24.879,8.318c1.171-1.171,3.071-1.171,4.243,0s1.171,3.071,0,4.243 c-0.626,0.626-1.459,0.906-2.278,0.864l-2.672,2.672l-2.828-2.828l2.672-2.672C23.972,9.777,24.253,8.944,24.879,8.318z"/><path fill="#0f518c" d="M24.879,27.218c1.171,1.171,3.071,1.171,4.243,0c1.171-1.171,1.171-3.071,0-4.243 c-0.626-0.626-1.459-0.906-2.278-0.864l-2.672-2.672l-2.828,2.828l2.672,2.672C23.972,25.759,24.253,26.592,24.879,27.218z"/><g><path fill="#0f518c" d="M7.061,27.218c-1.171,1.171-3.071,1.171-4.243,0c-1.171-1.171-1.171-3.071,0-4.243 c0.626-0.626,1.459-0.906,2.278-0.864l2.672-2.672l2.828,2.828L7.925,24.94C7.967,25.759,7.686,26.592,7.061,27.218z"/></g></svg>
+    title: 可靠的维护支持
+    details: 我们有许多实际的使用案例，而且我们拥有快速的技术支持。
+---
diff --git a/docs/src/zhHans/installation-and-build/automated-testing.md b/docs/src/zhHans/installation-and-build/automated-testing.md
@@ -0,0 +1,23 @@
+---
+order: 4
+---
+
+# 自动测试
+
+**Vutron**包括自动测试。测试框架使用微软的\*\*[Playwright](https://playwright.dev)。
+
+**Playwright**针对网络应用测试进行了优化，并完全支持**Electron**框架。它易于安装，无需配置即可立即开始测试，并且是跨平台的。您可以在此处了解有关**Playwright**的更多信息：https://github.com/microsoft/playwright
+
+此模板仅对模板主屏幕进行了非常简单的启动和行为测试。高级测试取决于您的应用程序范围。
+
+目前，测试规范文件位于`tests`目录中，测试结果文件位于`tests/results`中。（内置测试规范文件不会生成单独的结果文件。）
+
+Playwright配置文件位于项目根目录下的playwright.config.ts，更多信息请参阅以下文档：https://playwright.dev/docs/test-configuration
+
+完成所有配置后，您可以使用以下命令进行测试。
+
+```shell
+$ npm run test
+```
+
+在运行测试之前，请清空构建目录（`dist`）并编译测试包。
diff --git a/docs/src/zhHans/installation-and-build/build-configuration.md b/docs/src/zhHans/installation-and-build/build-configuration.md
@@ -0,0 +1,84 @@
+---
+order: 2
+---
+
+# 构建配置
+
+模块安装完成后，只需执行以下命令即可构建平台软件包。
+
+```shell
+# For Windows (.exe, .appx)
+$ npm run build:win
+
+# For macOS (.dmg)
+$ npm run build:mac
+
+# For Linux (.rpm, .deb, .snap)
+$ npm run build:linux
+
+# All platform (.exe, .appx, .dmg, .rpm, .deb, .snap) - see below description
+$ npm run build:all
+```
+
+已构建的软件包可在 `release/{version}` 位置找到。
+
+如需了解更多信息，请参阅以下文章： https://webpack.electron.build/dependency-management#installing-native-node-modules
+
+## 多平台构建需要做些什么？
+
+要为每个操作系统创建软件包，必须在相同的操作系统上构建。例如，macOS 的软件包必须在 macOS 机器上构建。
+
+不过，你可以在一个操作系统上同时为 Windows、macOS 和 Linux 构建软件包。不过，这可能需要一些准备工作。
+
+如果想在一个平台上同时构建多个平台，建议使用**macOS**。因为只需几个非常简单的设置就能对其进行配置。
+
+您可以使用以下命令同时执行多平台构建。或者，你也可以通过上面的单独构建命令，只针对你想要的操作系统进行构建。
+
+```shell
+$ npm run build:all
+```
+
+Linux 构建可能需要 "Multipass" 配置。通过以下链接了解有关 `Multipass` 的更多信息： https://multipass.run
+
+要了解有关多平台构建的更多信息，请参阅以下文章： https://electron.build/multi-platform-build
+
+## 通过排除开发文件减少软件包大小
+
+您可以通过在 `buildAssets/builder/config.ts` 的 files 属性中添加文件模式，在构建时排除不需要的文件。这将节省捆绑包的容量。
+
+下面是一个不必要的 `node_modules` 文件模式，可以进一步节省捆绑包。根据项目情况，使用下面的规则可能会导致问题，因此请在使用前进行审查。
+
+```json
+[
+  "!**/.*",
+  "!**/node_modules/**/{CONTRIBUTORS,CNAME,AUTHOR,TODO,CONTRIBUTING,COPYING,INSTALL,NEWS,PORTING,Makefile,htdocs,CHANGELOG,ChangeLog,changelog,README,Readme,readme,test,sample,example,demo,composer.json,tsconfig.json,jsdoc.json,tslint.json,typings.json,gulpfile,bower.json,package-lock,Gruntfile,CMakeLists,karma.conf,yarn.lock}*",
+  "!**/node_modules/**/{man,benchmark,node_modules,spec,cmake,browser,vagrant,doxy*,bin,obj,obj.target,example,examples,test,tests,doc,docs,msvc,Xcode,CVS,RCS,SCCS}{,/**/*}",
+  "!**/node_modules/**/*.{conf,png,pc,coffee,txt,spec.js,ts,js.flow,html,def,jst,xml,ico,in,ac,sln,dsp,dsw,cmd,vcproj,vcxproj,vcxproj.filters,pdb,exp,obj,lib,map,md,sh,gypi,gyp,h,cpp,yml,log,tlog,Makefile,mk,c,cc,rc,xcodeproj,xcconfig,d.ts,yaml,hpp}",
+  "!**/node_modules/**/node-v*-x64{,/**/*}",
+  "!**/node_modules/bluebird/js/browser{,/**/*}",
+  "!**/node_modules/bluebird/js/browser{,/**/*}",
+  "!**/node_modules/source-map/dist{,/**/*}",
+  "!**/node_modules/lodash/fp{,/**/*}",
+  "!**/node_modules/async/!(dist|package.json)",
+  "!**/node_modules/async/internal{,/**/*}",
+  "!**/node_modules/ajv/dist{,/**/*}",
+  "!**/node_modules/ajv/scripts{,/**/*}",
+  "!**/node_modules/node-pre-gyp/!(lib|package.json)",
+  "!**/node_modules/node-pre-gyp/lib/!(util|pre-binding.js|node-pre-gyp.js)",
+  "!**/node_modules/node-pre-gyp/lib/util/!(versioning.js|abi_crosswalk.json)",
+  "!**/node_modules/source-map-support/browser-source-map-support.js",
+  "!**/node_modules/json-schema/!(package.json|lib)"
+]
+```
+
+## 使用本地 Node 模块的项目的构建设置
+
+对于使用 **Native Node Module**的项目，请将以下脚本添加到您的 `package.json`： 安装依赖项时，`electron-builder` 会处理任何需要重建的模块。
+
+```json
+{
+  "scripts": {
+    "postinstall": "electron-builder install-app-deps"
+  }
+}
+```
diff --git a/docs/src/zhHans/installation-and-build/getting-started.md b/docs/src/zhHans/installation-and-build/getting-started.md
@@ -0,0 +1,58 @@
+---
+order: 1
+---
+
+# 入门
+
+## 克隆项目
+
+### 方法 1: `npm init` (推荐)
+
+只需使用 npm 命令，就能轻松克隆一个版本库。
+
+```shell
+$ npm init vutron
+```
+
+上述方法不会为项目创建不必要的文档和`.github`相关文件。
+
+### 方法 2: 使用此模板
+
+点击 **[使用此模板](https://github.com/jooy2/vutron/generate)**，立即创建自己的项目。
+
+此方法可立即在 GitHub 上创建一个仓库，但在使用之前，您需要在本地克隆该项目。
+
+### 方法 3: 克隆该版本库
+
+使用以下命令克隆该 repo。此方法适用于直接向 Vutron 代码库投稿。
+
+```shell
+$ git clone https://github.com/jooy2/vutron <PROJECT_NAME>
+```
+
+## 安装
+
+克隆项目后，在终端运行以下命令:
+
+```shell
+# via npm
+$ npm i
+
+# via yarn (https://yarnpkg.com)
+$ yarn install
+
+# via pnpm (https://pnpm.io)
+$ pnpm i
+```
+
+## 在开发环境中运行
+
+开发环境中的应用程序通过 **[Vite](https://vitejs.dev)** 运行。
+
+```shell
+$ npm run dev
+```
+
+如果运行命令行命令后应用程序没有出现，您可能需要检查默认端口是否被其他应用程序使用。
+
+Vite 默认使用端口 `5173`。
diff --git a/docs/src/zhHans/installation-and-build/index.md b/docs/src/zhHans/installation-and-build/index.md
@@ -0,0 +1 @@
+# 安装和构建
diff --git a/docs/src/zhHans/installation-and-build/install-local-documentation.md b/docs/src/zhHans/installation-and-build/install-local-documentation.md
@@ -0,0 +1,36 @@
+---
+order: 5
+---
+
+# 管理本地文档
+
+Vutron 中的文档可以通过 VitePress 查看器在本地环境中查看。
+
+此功能仅在克隆整个项目时可用。如果您使用 npm init vutron 创建项目，则不会包含 docs 文件夹。
+
+## 安装
+
+以下说明中的所有操作均应在"文档"文件夹中完成。
+
+```shell
+$ cd docs
+```
+
+使用以下命令安装相关软件包：
+
+```shell
+# via npm
+$ npm i
+
+# via yarn (https://yarnpkg.com)
+$ yarn install
+
+# via pnpm (https://pnpm.io)
+$ pnpm i
+```
+
+您可以通过以下命令运行托管文档的本地服务器。
+
+```shell
+$ npm run dev
+```
diff --git a/docs/src/zhHans/installation-and-build/npm-scripts.md b/docs/src/zhHans/installation-and-build/npm-scripts.md
@@ -0,0 +1,39 @@
+---
+title: NPM Scripts
+order: 3
+---
+
+# Npm 脚本
+
+> $ npm run %SCRIPT_NAME%
+
+## 一般情况
+
+| 脚本名称          | 说明                                                       |
+| ----------------- | ---------------------------------------------------------- |
+| `dev`             | 启动电子作为开发环境                                       |
+| `dev:debug`       | 将 Electron 作为开发环境启动（使用 vite debug）            |
+| `dev:debug:force` | 以Electron作为开发环境启动（使用vite调试+清理vite缓存）    |
+| `build:pre`       | 通常在编译时运行的命令。此脚本无需单独运行。               |
+| `build`           | 为当前操作系统打包。                                       |
+| `build:all`       | 为整个操作系统构建指定软件包（需要跨平台构建配置）         |
+| `build:dir`       | `electron-builder`目录构建                                 |
+| `build:mac`       | 为macOS构建预配置软件包                                    |
+| `build:linux`     | 为Linux构建预配置软件包                                    |
+| `build:win`       | 为Windows构建预配置软件包                                  |
+| `lint`            | ESLint代码检查。它不会修改代码。                           |
+| `lint:fix`        | ESLint代码检查。使用自动修复功能修复代码。                 |
+| `format`          | 更漂亮的代码检查。它不会修改代码。                         |
+| `format:fix`      | 更漂亮的代码检查。使用自动修复功能修复代码。               |
+| `test`            | 根据测试规范文件构建测试包并运行测试。                     |
+| `test:linux`      | 根据测试规范文件构建测试包并运行测试。（仅适用于linux ci） |
+
+## 文档
+
+仅用于为项目文档提供素材。必须从“文档”目录位置运行。
+
+| Script Name | Description                                    |
+| ----------- | ---------------------------------------------- |
+| `dev`       | 启动本地文档服务器。（开发中）                 |
+| `build`     | 构建本地文档服务器。仅用于 GitHub 页面构建器。 |
+| `serve`     | 启动本地文档服务器。                           |
diff --git a/docs/src/zhHans/introduction.md b/docs/src/zhHans/introduction.md
@@ -0,0 +1,21 @@
+# 导言
+
+**Vutron** 是一个预配置的模板，用于开发 `Electron` 跨平台桌面应用。它使用 `Vue 3`，使您能够轻松构建快速的开发环境。
+
+## 使用优势
+
+- ✅ 无需任何预设，即可立即构建，快速开发。
+- ✅ 快速维护，与最新的 `Vue` 和 `Electron` 以及许多模块兼容。
+- ✅ 通过使用各种附加模板，无需担心布局和数据管理。
+
+## 特点
+
+- ⚡️ 通过热重载实现快速开发
+- ⚡️ 跨平台开发和构建支持
+- ⚡️ 支持自动化应用程序测试
+- ⚡️ 支持 TypeScript
+- ⚡️ 多语言支持
+- ⚡️ 支持主题（暗色和亮色）
+- ⚡️ 基本布局管理器
+- ⚡️ 通过 Pinia 存储进行全局状态管理
+- ⚡️ 通过 GitHub 社区和官方文档提供快速支持