97 lines
2.4 KiB
Markdown
97 lines
2.4 KiB
Markdown
# LLM Log Frontend
|
||
|
||
基于 **Astro 6**、**Tailwind CSS v4** 和 **Content Collections** 构建的现代化文档站点。
|
||
|
||
## 功能特性
|
||
|
||
- **Astro 6** - 下一代静态站点生成器，支持 Content Collections
|
||
- **Tailwind CSS v4** - 使用 `@tailwindcss/vite` 集成的原子化 CSS 框架
|
||
- **排版插件** - 使用 `@tailwindcss/typography` 实现美观的 Markdown 渲染
|
||
- **数学公式** - 通过 `remark-math` + `rehype-katex` 支持 LaTeX 数学公式
|
||
- **代码高亮** - 使用 `rehype-pretty-code` 实现语法高亮（github-dark 主题）
|
||
- **中文优化** - 专为中文文档内容优化
|
||
|
||
## 技术栈
|
||
|
||
| 包名 | 版本 | 用途 |
|
||
|------|------|------|
|
||
| astro | ^6.1.9 | 静态站点生成器 |
|
||
| tailwindcss | ^4.2.4 | CSS 框架 |
|
||
| @tailwindcss/vite | ^4.2.4 | Tailwind Vite 插件 |
|
||
| @tailwindcss/typography | ^0.5.19 | Markdown 文章样式 |
|
||
| remark-math | ^6.0.0 | Markdown 数学插件 |
|
||
| rehype-katex | ^7.0.1 | KaTeX HTML 渲染器 |
|
||
| rehype-pretty-code | ^0.14.3 | 代码语法高亮 |
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
llm_log_frontend/
|
||
├── src/
|
||
│ ├── content/
|
||
│ │ └── docs/ # Markdown 文档文件
|
||
│ │ └── test.md
|
||
│ ├── layouts/
|
||
│ │ └── BaseLayout.astro # 基础 HTML 布局
|
||
│ ├── pages/
|
||
│ │ ├── index.astro # 首页
|
||
│ │ └── docs/
|
||
│ │ └── [...slug].astro # 动态文档路由
|
||
│ └── styles/
|
||
│ └── global.css # Tailwind 入口
|
||
├── public/ # 静态资源
|
||
├── astro.config.mjs # Astro 配置
|
||
├── tailwind.config.mjs # Tailwind + Typography 配置
|
||
├── package.json
|
||
└── tsconfig.json
|
||
```
|
||
|
||
## 快速开始
|
||
|
||
```bash
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 启动开发服务器
|
||
npm run dev
|
||
|
||
# 构建生产版本
|
||
npm run build
|
||
|
||
# 预览生产构建
|
||
npm run preview
|
||
```
|
||
|
||
## 命令说明
|
||
|
||
| 命令 | 操作 |
|
||
|------|------|
|
||
| `npm run dev` | 在 `localhost:4321` 启动开发服务器 |
|
||
| `npm run build` | 构建输出到 `./dist/` |
|
||
| `npm run preview` | 本地预览生产构建 |
|
||
| `npm run astro -- --help` | 获取 Astro CLI 帮助 |
|
||
|
||
## 编写文档
|
||
|
||
在 `src/content/docs/` 目录下创建 Markdown 文件：
|
||
|
||
```markdown
|
||
---
|
||
title: "我的文档"
|
||
---
|
||
|
||
# 标题
|
||
|
||
内容含 LaTeX 公式：$E=mc^2$
|
||
|
||
```javascript
|
||
const hello = "world";
|
||
```
|
||
```
|
||
|
||
文档会自动通过 `[...slug].astro` 页面进行路由。
|
||
|
||
## License
|
||
|
||
MIT
|