feat(projects): add vitepress docs

soybeanjs · Jan 17, 2024 · 5f72fa8 · 5f72fa8
1 parent da28076
commit 5f72fa8
Show file tree

Hide file tree

Showing 22 changed files with 212 additions and 34 deletions.
diff --git a/.gitignore b/.gitignore
@@ -33,3 +33,4 @@ package-lock.json
 yarn.lock
 
 .VSCodeCounter
+**/.vitepress/cache
diff --git a/README.md b/README.md
@@ -12,13 +12,13 @@
 
 ## Features
 
-- **Popular technology stack**：Vue3, Vite5, TypeScript, Pinia, UnoCSS.
-- **Clean Structure**：Use pnpm monorepo, clean and elegant structure, easy to maintain.
-- **TypeScript**：Strictly typed, easy to maintain.
-- **Theme**：Built-in rich theme configuration, easy to incorporate UnoCSS.
-- **File routing System**：Automatic, intelligent file routing system. more details in [Elegant Router](https://github.com/soybeanjs/elegant-router).
+- **Popular technology stack**: Vue3, Vite5, TypeScript, Pinia, UnoCSS.
+- **Clean Structure**: Use pnpm monorepo, clean and elegant structure, easy to maintain.
+- **TypeScript**: Strictly typed, easy to maintain.
+- **Theme configuration**: Built-in rich theme configuration, easy to incorporate UnoCSS.
+- **File routing System**: Automatic, intelligent file routing system. more details in [Elegant Router](https://github.com/soybeanjs/elegant-router).
 - **Auth Router**: Support front-end static routing and back-end dynamic routing.
-- **Code Specification**：Very high code specification. more details in [SoybeanJS Code Standard]().
+- **Code Specification**: Very high code specification. more details in [SoybeanJS Code Standard]().
 
 ## Preview
 
@@ -116,7 +116,7 @@ It is recommended to use the latest version of Chrome in development for a bette
 
   <img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat.jpeg" style="width:200px" />
 
-## Donation
+## Donate
 
 If you think this project is helpful to you, you can buy Soybean a drink to show your support, Soybean open source power can not be separated from your support and encouragement.
 

diff --git a/README.zh_CN.md b/README.zh_CN.md
@@ -15,7 +15,7 @@
 - **最新流行技术栈**：Vue3、Vite5、TypeScript、NaiveUI、Pinia 和 UnoCSS。
 - **清晰的项目结构**：采用 pnpm monorepo，结构清晰优雅，易于维护。
 - **TypeScript**：严格的类型检查，易于维护。
-- **主题**：内置丰富的主题配置，轻松结合 UnoCSS。
+- **主题配置**：内置丰富的主题配置，轻松结合 UnoCSS。
 - **文件路由系统**：自动化、智能化的文件路由系统。更多细节请查看 [Elegant Router](https://github.com/soybeanjs/elegant-router)。
 - **权限路由**：支持前端静态路由和后端动态路由。
 - **代码规范**：代码规范性极高。更多细节请查看 [SoybeanJS Code Standard]()。

diff --git a/packages/docs/.vitepress/config.ts b/packages/docs/.vitepress/config.ts
@@ -1,17 +1,71 @@
 import process from 'node:process';
 import path from 'node:path';
 import { defineConfig } from 'vitepress';
+import { qqSvg } from './icon.js';
 
 export default defineConfig({
-  title: 'Soybean Admin',
-  description: '一个优雅、清新、漂亮的中后台模版',
+  locales: {
+    root: {
+      label: 'English',
+      lang: 'en',
+      dir: 'src/en',
+      title: 'Soybean Admin',
+      description: 'a fresh and elegant admin template'
+    },
+    zh: {
+      label: '简体中文',
+      lang: 'zh',
+      dir: 'src/zh',
+      title: 'Soybean Admin',
+      description: '一个清新优雅的后台管理模板',
+      themeConfig: {
+        footer: {
+          message: '根据 MIT 许可证发布',
+          copyright: 'Copyright © 2021 Soybean'
+        },
+        nav: [
+          { text: '指引', link: '/zh/guide/introduction', activeMatch: '/zh/guide/' },
+          { text: '常见问题', link: '/zh/faq/', activeMatch: '/zh/faq/' },
+          { text: '规范', link: '/zh/standard/', activeMatch: '/zh/standard/' },
+          { text: '教程', link: '/zh/tutorial/', activeMatch: '/zh/tutorial/' },
+          {
+            text: '捐赠',
+            link: '/zh/other/donate'
+          },
+          {
+            text: '链接',
+            items: [
+              {
+                text: 'Preview',
+                link: 'https://soybeanjs.cn'
+              },
+              {
+                text: 'Repository',
+                link: 'https://github.com/honghuangdc/soybean-admin'
+              }
+            ]
+          }
+        ],
+        sidebar: {
+          '/zh/guide/': [
+            {
+              text: '介绍',
+              link: '/guide/introduction'
+            }
+          ],
+          '/zh/faq/': [],
+          '/zh/standard/': []
+        }
+      }
+    }
+  },
   head: [
     ['meta', { name: 'author', content: 'Soybean' }],
     [
       'meta',
       {
         name: 'keywords',
-        content: 'soybean, soybean-admin, vite, vue, vue3, soybean-admin docs'
+        content: 'soybean, soybean-admin, soybean-admin docs'
       }
     ],
     ['link', { rel: 'icon', type: 'image/svg+xml', href: '/logo.svg' }],
@@ -24,16 +78,61 @@ export default defineConfig({
     ],
     ['link', { rel: 'icon', href: '/favicon.ico' }]
   ],
-  srcDir: path.join(process.cwd(), 'packages/docs/src'),
+  assetsDir: path.join(process.cwd(), 'public'),
+  srcDir: path.join(process.cwd(), 'src'),
   themeConfig: {
     logo: '/logo.svg',
-    socialLinks: [{ icon: 'github', link: 'https://github.com/honghuangdc/soybean-admin' }],
+    socialLinks: [
+      { icon: 'github', link: 'https://github.com/soybeanjs' },
+      { icon: 'discord', link: 'https://discord.gg/n44HfksX' },
+      {
+        icon: {
+          svg: qqSvg
+        },
+        link: 'https://qm.qq.com/cgi-bin/qm/qr?k=XTjkqjV1KynFoEAdrqxMd6i71-TtCVGV&jump_from=webapi'
+      }
+    ],
     algolia: {
       appId: '98WN1RY04S',
       apiKey: '13e9f5767b774422a5880723d9c23265',
       indexName: 'soybean'
     },
-    nav: [],
-    sidebar: {}
+    footer: {
+      message: 'Publish under the MIT license',
+      copyright: 'Copyright © 2021 Soybean'
+    },
+    nav: [
+      { text: 'Guide', link: '/guide/introduction', activeMatch: '/guide/' },
+      { text: 'FAQ', link: '/faq/', activeMatch: '/faq/' },
+      { text: 'Standard', link: '/standard/', activeMatch: '/standard/' },
+      { text: 'Tutorial', link: '/tutorial/', activeMatch: '/tutorial/' },
+      {
+        text: 'Donate',
+        link: '/other/donate'
+      },
+      {
+        text: 'Links',
+        items: [
+          {
+            text: 'Preview',
+            link: 'https://soybeanjs.cn'
+          },
+          {
+            text: 'Repository',
+            link: 'https://github.com/honghuangdc/soybean-admin'
+          }
+        ]
+      }
+    ],
+    sidebar: {
+      '/guide/': [
+        {
+          text: 'Introduction',
+          link: '/guide/introduction'
+        }
+      ],
+      '/faq/': [],
+      '/standard/': []
+    }
   }
 });
diff --git a/packages/docs/package.json b/packages/docs/package.json
@@ -1,9 +1,10 @@
 {
   "name": "@sa/docs",
+  "type": "module",
   "version": "1.0.0",
   "scripts": {
     "build": "vitepress build",
-    "dev": "vitepress dev",
+    "dev": "vitepress dev --port 1026",
     "serve": "vitepress serve"
   },
   "devDependencies": {

diff --git a/packages/docs/src/faq/index.md b/packages/docs/src/faq/index.md
@@ -0,0 +1 @@
+# FAQ
diff --git a/packages/docs/src/guide/index.md b/packages/docs/src/guide/index.md
@@ -0,0 +1,3 @@
+# Guide
+
+
diff --git a/packages/docs/src/guide/introduction.md b/packages/docs/src/guide/introduction.md
@@ -0,0 +1 @@
+# Introduction
diff --git a/packages/docs/src/index.md b/packages/docs/src/index.md
@@ -2,43 +2,43 @@
 layout: home
 
 title: Soybean Admin
-titleTemplate: 一个清新优雅的中后台模版
+titleTemplate: A fresh and elegant admin template
 
 hero:
   name: Soybean Admin
-  text: 清新优雅的中后台模版
-  tagline: 基于 Vue3 + Vite3 + TS + NaiveUI + UnoCSS
+  text: Fresh and elegant
+  tagline: Based on Vue3,Vite5,TypeScript and UnoCSS
   image:
     src: /logo.svg
     alt: Soybean Admin
   actions:
     - theme: brand
-      text: 开始
+      text: Start
       link: /guide/
     - theme: alt
-      text: 介绍
+      text: Introduction
       link: /guide/introduction
     - theme: alt
-      text: 在 GitHub 上查看
+      text: View on GitHub
       link: https://github.com/honghuangdc/soybean-admin
 
 features:
   - icon: 🆕
-    title: 最新流行技术栈
-    details: 基于Vue3、Vite3、TS、NaiveUI和UnoCSS等最新技术栈开发
+    title: Latest popular technology stack
+    details: Vue3, Vite5, TypeScript, Pinia, UnoCSS.
   - icon: 🦋
-    title: 极高水准的代码规范
-    details: 代码规范完善，代码结构清晰
+    title: Clean Structure
+    details: Use pnpm monorepo, clean and elegant structure, easy to maintain. Very high code specification.
   - icon: 🛠️
-    title: 丰富的插件
-    details: 常见的Web端插件示例实现
+    title: TypeScript
+    details: Strictly typed, easy to maintain.
   - icon: 🔩
-    title: 主题配置
-    details: 丰富的主题配置及暗黑主题适配
+    title: Theme
+    details: Built-in rich theme configuration, easy to incorporate UnoCSS.
   - icon: 🔗
-    title: 基于文件的路由系统
-    details: 自动生成路由声明、路由导入和路由模块
+    title: File routing System
+    details: Automatic, intelligent file routing system.
   - icon: 🔑
-    title: 权限管理
-    details: 完善的前后端权限管理方案
+    title: Auth Router
+    details: Support front-end static routing and back-end dynamic routing.
 ---
diff --git a/packages/docs/src/other/donate.md b/packages/docs/src/other/donate.md
@@ -0,0 +1,5 @@
+# Donate
+
+If you think this project is helpful to you, you can buy Soybean a drink to show your support, Soybean open source power can not be separated from your support and encouragement.
+
+![](https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/donation.png)
diff --git a/packages/docs/src/public/favicon.ico b/packages/docs/src/public/favicon.ico
diff --git a/packages/docs/src/public/logo.svg b/packages/docs/src/public/logo.svg
diff --git a/packages/docs/src/public/tencent-qq.svg b/packages/docs/src/public/tencent-qq.svg
diff --git a/packages/docs/src/standard/index.md b/packages/docs/src/standard/index.md
@@ -0,0 +1 @@
+# Code Standard
diff --git a/packages/docs/src/tutorial/index.md b/packages/docs/src/tutorial/index.md
@@ -0,0 +1 @@
+# Tutorial
diff --git a/packages/docs/src/zh/faq/index.md b/packages/docs/src/zh/faq/index.md
@@ -0,0 +1 @@
+# 常见问题
diff --git a/packages/docs/src/zh/guide/index.md b/packages/docs/src/zh/guide/index.md
@@ -0,0 +1,3 @@
+# 指引
+
+
diff --git a/packages/docs/src/zh/guide/introduction.md b/packages/docs/src/zh/guide/introduction.md
@@ -0,0 +1 @@
+# 介绍
diff --git a/packages/docs/src/zh/index.md b/packages/docs/src/zh/index.md
@@ -0,0 +1,44 @@
+---
+layout: home
+
+title: Soybean Admin
+titleTemplate: 一个清新优雅的中后台模版
+
+hero:
+  name: Soybean Admin
+  text: 清新优雅的中后台模版
+  tagline: 基于 Vue3,Vite5,TypeScript 和 UnoCSS
+  image:
+    src: /logo.svg
+    alt: Soybean Admin
+  actions:
+    - theme: brand
+      text: 开始
+      link: /guide/
+    - theme: alt
+      text: 介绍
+      link: /guide/introduction
+    - theme: alt
+      text: 在 GitHub 上查看
+      link: https://github.com/honghuangdc/soybean-admin
+
+features:
+  - icon: 🆕
+    title: 最新流行技术栈
+    details: Vue3,Vite5,TypeScript 和 UnoCSS
+  - icon: 🦋
+    title: 清晰的项目结构
+    details: 采用 pnpm monorepo，结构清晰优雅，易于维护。代码规范性极高。
+  - icon: 🛠️
+    title: TypeScript
+    details: 严格的类型检查，易于维护。
+  - icon: 🔩
+    title: 主题配置
+    details: 内置丰富的主题配置，轻松结合 UnoCSS。
+  - icon: 🔗
+    title: 文件路由系统
+    details: 自动化、智能化的文件路由系统
+  - icon: 🔑
+    title: 权限路由
+    details: 支持前端静态路由和后端动态路由。
+---
diff --git a/packages/docs/src/zh/other/donate.md b/packages/docs/src/zh/other/donate.md
@@ -0,0 +1,5 @@
+# 捐赠
+
+如果您认为本项目对您有所帮助，可以请 Soybean 喝杯咖啡以示支持，Soybean 的开源动力离不开您的支持和鼓励。
+
+![](https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/donation.png)
diff --git a/packages/docs/src/zh/standard/index.md b/packages/docs/src/zh/standard/index.md
@@ -0,0 +1 @@
+# 代码规范
diff --git a/packages/docs/src/zh/tutorial/index.md b/packages/docs/src/zh/tutorial/index.md
@@ -0,0 +1 @@
+# 教程
Original file line number	Diff line number	Diff line change
Expand Up		@@ -33,3 +33,4 @@ package-lock.json
		yarn.lock

		.VSCodeCounter
		**/.vitepress/cache