@astro-minimax/cli 0.7.5 → 0.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/package.json +1 -1
- package/template/astro.config.ts +32 -11
- package/template/functions/api/chat.ts +19 -1
- package/template/package.json +10 -11
- package/template/public/favicon.ico +0 -0
- package/template/src/config.ts +3 -11
- package/template/src/data/blog/en/alerts-examples.md +64 -0
- package/template/src/data/blog/en/code-examples.md +99 -0
- package/template/src/data/blog/en/hello-world.md +78 -0
- package/template/src/data/blog/en/markmap-examples.md +100 -0
- package/template/src/data/blog/en/math-examples.md +58 -0
- package/template/src/data/blog/en/mermaid-examples.md +237 -0
- package/template/src/data/blog/en/series-example-01.md +41 -0
- package/template/src/data/blog/en/series-example-02.md +41 -0
- package/template/src/data/blog/zh/alerts-examples.md +2 -0
- package/template/src/data/blog/zh/code-examples.md +2 -0
- package/template/src/data/blog/zh/hello-world.md +47 -2
- package/template/src/data/blog/zh/markmap-examples.md +2 -0
- package/template/src/data/blog/zh/math-examples.md +2 -0
- package/template/src/data/blog/zh/mermaid-examples.md +188 -30
- package/template/src/data/blog/zh/series-example-01.md +41 -0
- package/template/src/data/blog/zh/series-example-02.md +41 -0
- package/template/tsconfig.json +4 -1
|
@@ -0,0 +1,237 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: "Mermaid Diagram Examples"
|
|
3
|
+
description: "Demonstrate Mermaid flowcharts, sequence diagrams, class diagrams, and 11 diagram types"
|
|
4
|
+
pubDatetime: 2024-01-02T00:00:00.000Z
|
|
5
|
+
author: "Your Name"
|
|
6
|
+
tags:
|
|
7
|
+
- tutorial
|
|
8
|
+
- Mermaid
|
|
9
|
+
category: Tutorial/Tools
|
|
10
|
+
---
|
|
11
|
+
|
|
12
|
+
This article demonstrates how to create various Mermaid diagrams using ` ```mermaid ` code blocks.
|
|
13
|
+
|
|
14
|
+
---
|
|
15
|
+
|
|
16
|
+
## 1. Flowchart
|
|
17
|
+
|
|
18
|
+
### 1.1 Basic Flowchart
|
|
19
|
+
|
|
20
|
+
```mermaid
|
|
21
|
+
flowchart TD
|
|
22
|
+
A[Start] --> B{Condition}
|
|
23
|
+
B -->|Yes| C[Execute A]
|
|
24
|
+
B -->|No| D[Execute B]
|
|
25
|
+
C --> E[End]
|
|
26
|
+
D --> E
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### 1.2 Horizontal Flowchart
|
|
30
|
+
|
|
31
|
+
```mermaid
|
|
32
|
+
flowchart LR
|
|
33
|
+
A[Request] --> B[Load Balancer]
|
|
34
|
+
B --> C[Server A]
|
|
35
|
+
B --> D[Server B]
|
|
36
|
+
C --> E[(Database)]
|
|
37
|
+
D --> E
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## 2. Sequence Diagram
|
|
43
|
+
|
|
44
|
+
```mermaid
|
|
45
|
+
sequenceDiagram
|
|
46
|
+
participant User
|
|
47
|
+
participant Frontend
|
|
48
|
+
participant Backend
|
|
49
|
+
participant Database
|
|
50
|
+
|
|
51
|
+
User->>Frontend: Click login
|
|
52
|
+
Frontend->>Backend: POST /api/login
|
|
53
|
+
Backend->>Database: Query user
|
|
54
|
+
Database-->>Backend: Return data
|
|
55
|
+
Backend-->>Frontend: Return JWT
|
|
56
|
+
Frontend-->>User: Redirect home
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
---
|
|
60
|
+
|
|
61
|
+
## 3. Class Diagram
|
|
62
|
+
|
|
63
|
+
```mermaid
|
|
64
|
+
classDiagram
|
|
65
|
+
class Animal {
|
|
66
|
+
+String name
|
|
67
|
+
+int age
|
|
68
|
+
+makeSound()
|
|
69
|
+
}
|
|
70
|
+
class Dog {
|
|
71
|
+
+String breed
|
|
72
|
+
+bark()
|
|
73
|
+
}
|
|
74
|
+
class Cat {
|
|
75
|
+
+String color
|
|
76
|
+
+meow()
|
|
77
|
+
}
|
|
78
|
+
Animal <|-- Dog
|
|
79
|
+
Animal <|-- Cat
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
---
|
|
83
|
+
|
|
84
|
+
## 4. State Diagram
|
|
85
|
+
|
|
86
|
+
```mermaid
|
|
87
|
+
stateDiagram-v2
|
|
88
|
+
[*] --> Pending
|
|
89
|
+
Pending --> Processing: Start
|
|
90
|
+
Processing --> Completed: Success
|
|
91
|
+
Processing --> Cancelled: Failure
|
|
92
|
+
Completed --> [*]
|
|
93
|
+
Cancelled --> [*]
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
---
|
|
97
|
+
|
|
98
|
+
## 5. ER Diagram
|
|
99
|
+
|
|
100
|
+
```mermaid
|
|
101
|
+
erDiagram
|
|
102
|
+
USER ||--o{ ORDER : places
|
|
103
|
+
USER {
|
|
104
|
+
int id PK
|
|
105
|
+
string username
|
|
106
|
+
string email
|
|
107
|
+
}
|
|
108
|
+
ORDER ||--|{ ORDER_ITEM : contains
|
|
109
|
+
ORDER {
|
|
110
|
+
int id PK
|
|
111
|
+
int user_id FK
|
|
112
|
+
datetime order_date
|
|
113
|
+
string status
|
|
114
|
+
}
|
|
115
|
+
PRODUCT ||--o{ ORDER_ITEM : "included in"
|
|
116
|
+
PRODUCT {
|
|
117
|
+
int id PK
|
|
118
|
+
string name
|
|
119
|
+
float price
|
|
120
|
+
}
|
|
121
|
+
ORDER_ITEM {
|
|
122
|
+
int id PK
|
|
123
|
+
int quantity
|
|
124
|
+
float unit_price
|
|
125
|
+
}
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
---
|
|
129
|
+
|
|
130
|
+
## 6. Gantt Chart
|
|
131
|
+
|
|
132
|
+
```mermaid
|
|
133
|
+
gantt
|
|
134
|
+
title Project Timeline
|
|
135
|
+
dateFormat YYYY-MM-DD
|
|
136
|
+
section Design
|
|
137
|
+
Requirements :a1, 2024-01-01, 7d
|
|
138
|
+
UI Design :a2, after a1, 5d
|
|
139
|
+
section Development
|
|
140
|
+
Frontend :b1, after a2, 14d
|
|
141
|
+
Backend :b2, after a2, 14d
|
|
142
|
+
section Testing
|
|
143
|
+
QA Testing :c1, after b1, 7d
|
|
144
|
+
Deployment :c2, after c1, 3d
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
---
|
|
148
|
+
|
|
149
|
+
## 7. Pie Chart
|
|
150
|
+
|
|
151
|
+
```mermaid
|
|
152
|
+
pie showData
|
|
153
|
+
title Programming Language Usage
|
|
154
|
+
"TypeScript" : 35
|
|
155
|
+
"Python" : 25
|
|
156
|
+
"Go" : 20
|
|
157
|
+
"Rust" : 12
|
|
158
|
+
"Others" : 8
|
|
159
|
+
```
|
|
160
|
+
|
|
161
|
+
---
|
|
162
|
+
|
|
163
|
+
## 8. Git Graph
|
|
164
|
+
|
|
165
|
+
```mermaid
|
|
166
|
+
gitGraph
|
|
167
|
+
commit id: "Init project"
|
|
168
|
+
commit id: "Add features"
|
|
169
|
+
branch develop
|
|
170
|
+
checkout develop
|
|
171
|
+
commit id: "WIP"
|
|
172
|
+
checkout main
|
|
173
|
+
merge develop id: "v1.0" tag: "v1.0"
|
|
174
|
+
```
|
|
175
|
+
|
|
176
|
+
---
|
|
177
|
+
|
|
178
|
+
## 9. User Journey
|
|
179
|
+
|
|
180
|
+
```mermaid
|
|
181
|
+
journey
|
|
182
|
+
title Shopping Experience
|
|
183
|
+
section Browse
|
|
184
|
+
Open homepage: 5: User
|
|
185
|
+
Search products: 4: User
|
|
186
|
+
section Purchase
|
|
187
|
+
Add to cart: 4: User
|
|
188
|
+
Checkout: 3: User, System
|
|
189
|
+
section Receive
|
|
190
|
+
Confirm delivery: 5: User
|
|
191
|
+
Rate product: 4: User
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
---
|
|
195
|
+
|
|
196
|
+
## 10. Mindmap
|
|
197
|
+
|
|
198
|
+
```mermaid
|
|
199
|
+
mindmap
|
|
200
|
+
root((Web Development))
|
|
201
|
+
Frontend
|
|
202
|
+
HTML/CSS
|
|
203
|
+
JavaScript
|
|
204
|
+
TypeScript
|
|
205
|
+
Frameworks
|
|
206
|
+
Vue
|
|
207
|
+
React
|
|
208
|
+
Backend
|
|
209
|
+
Node.js
|
|
210
|
+
Python
|
|
211
|
+
Go
|
|
212
|
+
Database
|
|
213
|
+
MySQL
|
|
214
|
+
MongoDB
|
|
215
|
+
Redis
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
---
|
|
219
|
+
|
|
220
|
+
## 11. Custom Styling
|
|
221
|
+
|
|
222
|
+
```mermaid
|
|
223
|
+
flowchart TD
|
|
224
|
+
A[Start] --> B[Process]
|
|
225
|
+
B --> C[End]
|
|
226
|
+
|
|
227
|
+
style A fill:#f9f,stroke:#333,stroke-width:2px
|
|
228
|
+
style B fill:#bbf,stroke:#333,stroke-width:2px
|
|
229
|
+
style C fill:#bfb,stroke:#333,stroke-width:2px
|
|
230
|
+
```
|
|
231
|
+
|
|
232
|
+
---
|
|
233
|
+
|
|
234
|
+
## References
|
|
235
|
+
|
|
236
|
+
- [Mermaid Documentation](https://mermaid.js.org/)
|
|
237
|
+
- [Mermaid Live Editor](https://mermaid.live/)
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: "Article Series Example - Part 1"
|
|
3
|
+
description: "First part of the article series, demonstrating series navigation"
|
|
4
|
+
pubDatetime: 2024-01-07T00:00:00.000Z
|
|
5
|
+
author: "Your Name"
|
|
6
|
+
tags:
|
|
7
|
+
- tutorial
|
|
8
|
+
- series
|
|
9
|
+
category: Tutorial/Examples
|
|
10
|
+
series:
|
|
11
|
+
name: Article Series Example
|
|
12
|
+
order: 1
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
## About Article Series
|
|
16
|
+
|
|
17
|
+
astro-minimax supports **article series** functionality, automatically displaying series navigation at the bottom of articles, including progress, previous and next links.
|
|
18
|
+
|
|
19
|
+
### Series Configuration
|
|
20
|
+
|
|
21
|
+
Add a `series` field in frontmatter:
|
|
22
|
+
|
|
23
|
+
```yaml
|
|
24
|
+
---
|
|
25
|
+
title: "Article Title"
|
|
26
|
+
series:
|
|
27
|
+
name: "Series Name"
|
|
28
|
+
order: 1 # Order in the series
|
|
29
|
+
---
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### Features
|
|
33
|
+
|
|
34
|
+
- Automatic series progress bar
|
|
35
|
+
- Shows current article position
|
|
36
|
+
- Auto-generates previous/next navigation
|
|
37
|
+
- Series page aggregates all articles
|
|
38
|
+
|
|
39
|
+
---
|
|
40
|
+
|
|
41
|
+
> **Next**: [Article Series Example - Part 2](/en/posts/series-example-02)
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: "Article Series Example - Part 2"
|
|
3
|
+
description: "Second part of the article series, continuing the demonstration"
|
|
4
|
+
pubDatetime: 2024-01-08T00:00:00.000Z
|
|
5
|
+
author: "Your Name"
|
|
6
|
+
tags:
|
|
7
|
+
- tutorial
|
|
8
|
+
- series
|
|
9
|
+
category: Tutorial/Examples
|
|
10
|
+
series:
|
|
11
|
+
name: Article Series Example
|
|
12
|
+
order: 2
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
## Series Advanced Topics
|
|
16
|
+
|
|
17
|
+
This is the second part of the series. When readers view this article, they can see:
|
|
18
|
+
|
|
19
|
+
- Series progress (e.g., 2/2)
|
|
20
|
+
- Link to the previous article
|
|
21
|
+
- Series overview
|
|
22
|
+
|
|
23
|
+
### Use Cases
|
|
24
|
+
|
|
25
|
+
Article series are perfect for:
|
|
26
|
+
|
|
27
|
+
- Multi-chapter tutorials
|
|
28
|
+
- Topic series
|
|
29
|
+
- Progressive learning paths
|
|
30
|
+
- Project development logs
|
|
31
|
+
|
|
32
|
+
### Best Practices
|
|
33
|
+
|
|
34
|
+
1. **Consistent Naming**: Use consistent naming patterns within the series
|
|
35
|
+
2. **Appropriate Splitting**: Each article should focus on one topic
|
|
36
|
+
3. **Cross-References**: Reference other parts appropriately
|
|
37
|
+
4. **Completeness**: Ensure articles form a complete knowledge system
|
|
38
|
+
|
|
39
|
+
---
|
|
40
|
+
|
|
41
|
+
> **Previous**: [Article Series Example - Part 1](/en/posts/series-example-01)
|
|
@@ -2,8 +2,15 @@
|
|
|
2
2
|
title: "你好,世界"
|
|
3
3
|
description: "这是我的第一篇博客文章,由 astro-minimax 主题驱动。"
|
|
4
4
|
pubDatetime: 2026-01-01T00:00:00.000Z
|
|
5
|
+
author: "Your Name"
|
|
6
|
+
# draft: false # Optional: Set true to hide from production
|
|
7
|
+
# featured: false # Optional: Set true to feature on homepage
|
|
5
8
|
tags:
|
|
6
9
|
- 入门
|
|
10
|
+
category: 教程/入门
|
|
11
|
+
# series: # Optional: Article series configuration
|
|
12
|
+
# name: "Getting Started Series"
|
|
13
|
+
# order: 1
|
|
7
14
|
---
|
|
8
15
|
|
|
9
16
|
## 欢迎来到我的博客
|
|
@@ -21,13 +28,51 @@ tags:
|
|
|
21
28
|
title: "文章标题"
|
|
22
29
|
description: "文章描述"
|
|
23
30
|
pubDatetime: 2026-01-01T00:00:00.000Z
|
|
31
|
+
author: "作者名称"
|
|
24
32
|
tags:
|
|
25
33
|
- 标签名
|
|
34
|
+
category: 分类/子分类
|
|
26
35
|
---
|
|
27
36
|
```
|
|
28
37
|
|
|
38
|
+
### 可选字段
|
|
39
|
+
|
|
40
|
+
```yaml
|
|
41
|
+
# draft: false # 设为 true 可隐藏文章
|
|
42
|
+
# featured: false # 设为 true 可在首页突出显示
|
|
43
|
+
# modDatetime: ... # 最后修改时间
|
|
44
|
+
# series: # 系列文章配置
|
|
45
|
+
# name: "系列名称"
|
|
46
|
+
# order: 1
|
|
47
|
+
```
|
|
48
|
+
|
|
29
49
|
### 自定义主题
|
|
30
50
|
|
|
31
|
-
编辑 `src/config.ts`
|
|
51
|
+
编辑 `src/config.ts` 来自定义博客:
|
|
52
|
+
|
|
53
|
+
```typescript
|
|
54
|
+
SITE: {
|
|
55
|
+
title: "我的博客",
|
|
56
|
+
author: "Your Name",
|
|
57
|
+
desc: "博客描述",
|
|
58
|
+
// 功能开关
|
|
59
|
+
features: {
|
|
60
|
+
tags: true, # 标签页
|
|
61
|
+
categories: true, # 分类页
|
|
62
|
+
series: true, # 系列页
|
|
63
|
+
archives: true, # 归档页
|
|
64
|
+
search: true, # 搜索页
|
|
65
|
+
},
|
|
66
|
+
darkMode: true, # 暗色模式
|
|
67
|
+
}
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
### 内置功能
|
|
71
|
+
|
|
72
|
+
- ✅ **Markdown 扩展** - 数学公式、代码高亮、GitHub Alerts
|
|
73
|
+
- ✅ **可视化** - Mermaid 图表、Markmap 思维导图
|
|
74
|
+
- ✅ **SEO 优化** - 自动生成 sitemap、RSS、Open Graph
|
|
75
|
+
- ✅ **多语言** - 支持中英文双语
|
|
76
|
+
- ✅ **暗色模式** - 自动跟随系统或手动切换
|
|
32
77
|
|
|
33
|
-
祝你写作愉快!
|
|
78
|
+
祝你写作愉快!
|
|
@@ -1,27 +1,45 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: "Mermaid 图表示例"
|
|
3
|
-
description: "展示 Mermaid
|
|
3
|
+
description: "展示 Mermaid 流程图、时序图、类图、状态图等 11 种图表类型"
|
|
4
4
|
pubDatetime: 2024-01-02T00:00:00.000Z
|
|
5
|
+
author: "Your Name"
|
|
5
6
|
tags:
|
|
6
7
|
- 教程
|
|
7
8
|
- Mermaid
|
|
9
|
+
category: 教程/工具
|
|
8
10
|
---
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
本文展示如何使用 ` ```mermaid ` 代码块语法创建各种 Mermaid 图表。
|
|
13
|
+
|
|
14
|
+
---
|
|
15
|
+
|
|
16
|
+
## 一、流程图 (Flowchart)
|
|
17
|
+
|
|
18
|
+
### 1.1 基本流程图
|
|
19
|
+
|
|
20
|
+
```mermaid
|
|
21
|
+
flowchart TD
|
|
22
|
+
A[开始] --> B{条件判断}
|
|
23
|
+
B -->|是| C[执行操作A]
|
|
24
|
+
B -->|否| D[执行操作B]
|
|
25
|
+
C --> E[结束]
|
|
26
|
+
D --> E
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### 1.2 横向流程图
|
|
11
30
|
|
|
12
31
|
```mermaid
|
|
13
|
-
|
|
14
|
-
A[
|
|
15
|
-
B
|
|
16
|
-
B
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
F -->|是| C
|
|
20
|
-
F -->|否| G[显示错误]
|
|
21
|
-
G --> E
|
|
32
|
+
flowchart LR
|
|
33
|
+
A[用户请求] --> B[负载均衡]
|
|
34
|
+
B --> C[服务器A]
|
|
35
|
+
B --> D[服务器B]
|
|
36
|
+
C --> E[(数据库)]
|
|
37
|
+
D --> E
|
|
22
38
|
```
|
|
23
39
|
|
|
24
|
-
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## 二、时序图 (Sequence Diagram)
|
|
25
43
|
|
|
26
44
|
```mermaid
|
|
27
45
|
sequenceDiagram
|
|
@@ -38,18 +56,79 @@ sequenceDiagram
|
|
|
38
56
|
前端-->>用户: 跳转到主页
|
|
39
57
|
```
|
|
40
58
|
|
|
41
|
-
|
|
59
|
+
---
|
|
60
|
+
|
|
61
|
+
## 三、类图 (Class Diagram)
|
|
42
62
|
|
|
43
63
|
```mermaid
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
64
|
+
classDiagram
|
|
65
|
+
class Animal {
|
|
66
|
+
+String name
|
|
67
|
+
+int age
|
|
68
|
+
+makeSound()
|
|
69
|
+
}
|
|
70
|
+
class Dog {
|
|
71
|
+
+String breed
|
|
72
|
+
+bark()
|
|
73
|
+
}
|
|
74
|
+
class Cat {
|
|
75
|
+
+String color
|
|
76
|
+
+meow()
|
|
77
|
+
}
|
|
78
|
+
Animal <|-- Dog
|
|
79
|
+
Animal <|-- Cat
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
---
|
|
83
|
+
|
|
84
|
+
## 四、状态图 (State Diagram)
|
|
85
|
+
|
|
86
|
+
```mermaid
|
|
87
|
+
stateDiagram-v2
|
|
88
|
+
[*] --> 待处理
|
|
89
|
+
待处理 --> 处理中: 开始处理
|
|
90
|
+
处理中 --> 已完成: 处理成功
|
|
91
|
+
处理中 --> 已取消: 处理失败
|
|
92
|
+
已完成 --> [*]
|
|
93
|
+
已取消 --> [*]
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
---
|
|
97
|
+
|
|
98
|
+
## 五、实体关系图 (ER Diagram)
|
|
99
|
+
|
|
100
|
+
```mermaid
|
|
101
|
+
erDiagram
|
|
102
|
+
USER ||--o{ ORDER : places
|
|
103
|
+
USER {
|
|
104
|
+
int id PK
|
|
105
|
+
string username
|
|
106
|
+
string email
|
|
107
|
+
}
|
|
108
|
+
ORDER ||--|{ ORDER_ITEM : contains
|
|
109
|
+
ORDER {
|
|
110
|
+
int id PK
|
|
111
|
+
int user_id FK
|
|
112
|
+
datetime order_date
|
|
113
|
+
string status
|
|
114
|
+
}
|
|
115
|
+
PRODUCT ||--o{ ORDER_ITEM : "included in"
|
|
116
|
+
PRODUCT {
|
|
117
|
+
int id PK
|
|
118
|
+
string name
|
|
119
|
+
float price
|
|
120
|
+
}
|
|
121
|
+
ORDER_ITEM {
|
|
122
|
+
int id PK
|
|
123
|
+
int order_id FK
|
|
124
|
+
int product_id FK
|
|
125
|
+
int quantity
|
|
126
|
+
}
|
|
50
127
|
```
|
|
51
128
|
|
|
52
|
-
|
|
129
|
+
---
|
|
130
|
+
|
|
131
|
+
## 六、甘特图 (Gantt Chart)
|
|
53
132
|
|
|
54
133
|
```mermaid
|
|
55
134
|
gantt
|
|
@@ -66,17 +145,96 @@ gantt
|
|
|
66
145
|
上线部署 :c2, after c1, 3d
|
|
67
146
|
```
|
|
68
147
|
|
|
69
|
-
|
|
148
|
+
---
|
|
149
|
+
|
|
150
|
+
## 七、饼图 (Pie Chart)
|
|
151
|
+
|
|
152
|
+
```mermaid
|
|
153
|
+
pie showData
|
|
154
|
+
title 编程语言使用占比
|
|
155
|
+
"TypeScript" : 35
|
|
156
|
+
"Python" : 25
|
|
157
|
+
"Go" : 20
|
|
158
|
+
"Rust" : 12
|
|
159
|
+
"Others" : 8
|
|
160
|
+
```
|
|
161
|
+
|
|
162
|
+
---
|
|
163
|
+
|
|
164
|
+
## 八、Git 图 (Git Graph)
|
|
165
|
+
|
|
166
|
+
```mermaid
|
|
167
|
+
gitGraph
|
|
168
|
+
commit id: "初始化项目"
|
|
169
|
+
commit id: "添加基础功能"
|
|
170
|
+
branch develop
|
|
171
|
+
checkout develop
|
|
172
|
+
commit id: "开发中"
|
|
173
|
+
commit id: "新功能A"
|
|
174
|
+
checkout main
|
|
175
|
+
merge develop id: "v1.0 发布" tag: "v1.0"
|
|
176
|
+
commit id: "后续优化"
|
|
177
|
+
```
|
|
178
|
+
|
|
179
|
+
---
|
|
180
|
+
|
|
181
|
+
## 九、用户旅程图 (User Journey)
|
|
70
182
|
|
|
71
183
|
```mermaid
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
184
|
+
journey
|
|
185
|
+
title 用户购物体验旅程
|
|
186
|
+
section 浏览商品
|
|
187
|
+
打开首页: 5: 用户
|
|
188
|
+
搜索商品: 4: 用户
|
|
189
|
+
section 购买流程
|
|
190
|
+
加入购物车: 4: 用户
|
|
191
|
+
结算付款: 3: 用户, 系统
|
|
192
|
+
section 收货评价
|
|
193
|
+
确认收货: 5: 用户
|
|
194
|
+
评价商品: 4: 用户
|
|
80
195
|
```
|
|
81
196
|
|
|
82
|
-
|
|
197
|
+
---
|
|
198
|
+
|
|
199
|
+
## 十、思维导图 (Mindmap)
|
|
200
|
+
|
|
201
|
+
```mermaid
|
|
202
|
+
mindmap
|
|
203
|
+
root((Web开发))
|
|
204
|
+
前端
|
|
205
|
+
HTML/CSS
|
|
206
|
+
JavaScript
|
|
207
|
+
TypeScript
|
|
208
|
+
框架
|
|
209
|
+
Vue
|
|
210
|
+
React
|
|
211
|
+
后端
|
|
212
|
+
Node.js
|
|
213
|
+
Python
|
|
214
|
+
Go
|
|
215
|
+
数据库
|
|
216
|
+
MySQL
|
|
217
|
+
MongoDB
|
|
218
|
+
Redis
|
|
219
|
+
```
|
|
220
|
+
|
|
221
|
+
---
|
|
222
|
+
|
|
223
|
+
## 十一、样式定制
|
|
224
|
+
|
|
225
|
+
```mermaid
|
|
226
|
+
flowchart TD
|
|
227
|
+
A[开始] --> B[处理]
|
|
228
|
+
B --> C[结束]
|
|
229
|
+
|
|
230
|
+
style A fill:#f9f,stroke:#333,stroke-width:2px
|
|
231
|
+
style B fill:#bbf,stroke:#333,stroke-width:2px
|
|
232
|
+
style C fill:#bfb,stroke:#333,stroke-width:2px
|
|
233
|
+
```
|
|
234
|
+
|
|
235
|
+
---
|
|
236
|
+
|
|
237
|
+
## 参考资料
|
|
238
|
+
|
|
239
|
+
- [Mermaid 官方文档](https://mermaid.js.org/)
|
|
240
|
+
- [Mermaid Live Editor](https://mermaid.live/)
|