feat: add github action build & vercel deployment configuration & support mermaid

.github/workflows/deploy.yml

@@ -0,0 +1,38 @@
+name: Deploy to Vercel
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
+      - name: Set up pnpm
+        uses: pnpm/action-setup@v3
+        with:
+          version: 10
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build project
+        run: pnpm build
+
+      - name: Deploy to Vercel
+        uses: amondnet/vercel-action@v25
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
+          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
+          vercel-args: '--prod'
+          working-directory: ./dist

.gitignore

@@ -22,3 +22,5 @@ pnpm-debug.log*
 
 # jetbrains setting folder
 .idea/
+
+.vercel

README.md

@@ -37,7 +37,7 @@ Enjoy it!
 
 ## 📖 Documentation
 
-前往：[Documentation](https://gyoza.lxchapu.com/posts/guide)
+前往：[Documentation](./src/content/posts/guide.md) 或 [在线文档](https://gyoza.lxchapu.com/posts/guide)
 
 ## 🚀 Project Structure
 
@@ -61,6 +61,16 @@ Enjoy it!
 
 网站配置保存在 `config.json` 文件。
 
+## 🚀 Deployment
+
+本项目使用 GitHub Actions 自动部署到 Vercel。你需要配置以下 GitHub Secrets：
+
+- `VERCEL_TOKEN`: Vercel 访问令牌。
+- `VERCEL_ORG_ID`: 你的 Vercel 组织 ID。
+- `VERCEL_PROJECT_ID`: 你在 Vercel 上对应的项目 ID。
+
+详细步骤请参考 [部署文档](./src/content/posts/guide.md#部署)。
+
 ## 🧞 Commands
 
 | Command        | Action                                       |
@@ -70,3 +80,5 @@ Enjoy it!
 | `pnpm build`   | Build your production site to `./dist/`      |
 | `pnpm preview` | Preview your build locally, before deploying |
 | `pnpm format`  | Format code using Prettier                   |
+
+`

astro.config.js

@@ -17,6 +17,7 @@ import { site } from './src/config.json'
 import remarkMath from 'remark-math'
 import rehypeKatex from 'rehype-katex'
 import swup from '@swup/astro'
+import rehypeMermaid from 'rehype-mermaid'
 
 // https://astro.build/config
 export default defineConfig({
@@ -42,6 +43,13 @@ export default defineConfig({
       rehypeLink,
       rehypeImage,
       rehypeHeading,
+      [
+        rehypeMermaid,
+        {
+          strategy: 'img-svg',
+          dark: true,
+        },
+      ],
       rehypeCodeBlock,
       rehypeCodeHighlight,
       rehypeTableBlock,

package.json

@@ -8,6 +8,7 @@
     "build": "astro check && astro build && pagefind --site dist",
     "preview": "astro preview",
     "astro": "astro",
+    "postinstall": "pnpx playwright-core install --with-deps chromium",
     "lint": "prettier --write .",
     "new-friend": "node scripts/new-friend.js",
     "new-post": "node scripts/new-post.js",
@@ -38,12 +39,14 @@
     "lodash-es": "^4.17.21",
     "mdast-util-to-string": "^4.0.0",
     "pagefind": "^1.1.0",
+    "playwright": "^1.52.0",
     "qrcode.react": "^3.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-toastify": "^10.0.5",
     "reading-time": "^1.5.0",
     "rehype-katex": "^7.0.0",
+    "rehype-mermaid": "^3.0.0",
     "remark-directive": "^3.0.0",
     "remark-math": "^6.0.0",
     "tailwindcss": "^3.4.3",