Merge pull request #20 from InvolutionHell/feat/CICD

添加自动化脚本, 当用户提交文档的时候优先把图片放到和MDX同一级

Author: Crokily

.github/workflows/content-check.yml

@@ -35,5 +35,12 @@ jobs:
           cache: "pnpm"
 
       - run: pnpm install --frozen-lockfile
+      # Non-blocking image migration + lint (visibility only)
+      - name: Migrate images next to MDX (check only)
+        run: pnpm migrate:images || echo "[warn] migrate:images failed (non-blocking)"
+
+      - name: Lint image references (non-blocking)
+        run: pnpm lint:images || echo "[warn] image lint found issues (non-blocking)"
+
       # Build the site to validate MDX and docs using Fumadocs
       - run: pnpm build

.husky/pre-commit

@@ -1 +1,11 @@
+# 1) 将 /images/* 文章图片就近复制并更新引用
+pnpm migrate:images || exit 1
+
+# 将迁移后的变更加入暂存，确保本次提交包含更新
+git add -A
+
+# 2) 校验图片路径与命名（不合规则阻止提交）
+pnpm lint:images || exit 1
+
+# 3) 其余按 lint-staged 处理（如 Prettier）
 pnpm exec lint-staged

CONTRIBUTING.md

@@ -30,7 +30,7 @@ touch docs/computer-science/data-structures/new-topic/index.mdx
 
 使用 Markdown/MDX 编写文章：
 
-````mdx
+```mdx
 ---
 title: "文章标题"
 description: "文章简短描述"
@@ -51,28 +51,16 @@ tags:
 更多内容...
 
 ## 代码示例
-
-```javascript
-// 你的代码
-function example() {
-  return "Hello World!";
-}
 ```
-````
-
-## 总结
-
-文章总结...
-
-````
 
 ### 步骤4：测试修改
 
 使用 Fumadocs 验证内容：
 
 ```bash
 pnpm build
-````
+pnpm migrate:images  # 迁移图片脚本
+```
 
 此命令将：
 
@@ -141,6 +129,17 @@ npm dev
 ## 📚 文档规范
 
 所有文档放在 `docs/` 目录。
+图片需要放在 被引用的文档的同名`assets`目录下(正常情况下您不应该关心这个, 该项目有自动脚本来移动图片), 例如:
+docxA 引用了 imgA 图片, 那么他们的文档结构应该是 `docxA.assets/imgA`:
+
+```md
+docsA.mdx
+docsA.assets/
+imgA
+```
+
+![img](public/readme_docs_structure.png)
+
 每个文档都需要一个 Frontmatter，例如：
 
 ```md

README.md

@@ -90,10 +90,17 @@ pnpm dev
 pnpm dev              # 启动开发服务器
 pnpm build            # 构建生产版本
 pnpm start            # 启动生产服务器
+pnpm postinstall
+pnpm lint:images      # 检查图片符合规则
+pnpm migrate:images   # 迁移图片
+```
 
-# 内容
+## 图片管理规范（简要）
 
+自动化脚本会移动您引用的图片到 MDX 同目录下, 遵循以下规则:
 
-# 导出
-pnpm export           # 导出静态站点到 /out 目录
-```
+- 存放：与 MDX 同目录的 `./<basename>.assets/` 中。
+  - 例：`foo.mdx` → `./foo.assets/<img>.png`；`index.mdx` → `./index.assets/<img>.png`。
+- 引用：相对路径 `![](./<basename>.assets/<img>.png)`。
+- 自动化：提交时自动迁移并改引用；图片 Lint 只提示不拦截提交。
+- 共享：站点级用 `/images/site/*`、组件演示用 `/images/components/<name>/*`；多文档共用的图片可保留 `/images/...`。

public/images/word/word-img-03.png …modal/llava/index.assets/word-img-03.pngpublic/images/word/word-img-03.png renamed to app/docs/ai/multimodal/llava/index.assets/word-img-03.png public/images/word/word-img-03.png renamed to app/docs/ai/multimodal/llava/index.assets/word-img-03.png

@@ -1,4 +1,4 @@
----
+---
 title: "LLaVA"
 description: "LLaVA多模态大模型框架：架构解析、CLIP基础、论文精读、复现实践"
 date: "2025-01-27"
@@ -12,7 +12,7 @@ tags:
 
 LLaVA (Large Language and Vision Assistant) 是多模态大模型的开创性框架，开启了视觉指令调优的新范式。
 
-![](/images/word/word-img-03.png)
+![](index.assets/word-img-03.png)
 
 ## 核心架构
 
@@ -22,9 +22,9 @@ LLaVA (Large Language and Vision Assistant) 是多模态大模型的开创性框
 ViT视觉编码器 → 投影层跨模态对齐 → LLM语言生成
 ```
 
-![](/images/word/word-img-04.png)
+![](index.assets/word-img-04.png)
 
-![](/images/word/word-img-05.png)
+![](index.assets/word-img-05.png)
 
 ### 技术特点
 

public/images/word/word-img-04.png …modal/llava/index.assets/word-img-04.pngpublic/images/word/word-img-04.png renamed to app/docs/ai/multimodal/llava/index.assets/word-img-04.png public/images/word/word-img-04.png renamed to app/docs/ai/multimodal/llava/index.assets/word-img-04.png

@@ -7,7 +7,9 @@
     "build": "next build",
     "start": "next start",
     "postinstall": "fumadocs-mdx",
-    "prepare": "husky"
+    "prepare": "husky",
+    "lint:images": "node scripts/check-images.mjs",
+    "migrate:images": "node scripts/move-doc-images.mjs"
   },
   "dependencies": {
     "@types/mdx": "^2.0.13",