文章编写指南
存放位置
所有文章 .md 文件放在 content/articles/ 目录下。
content/articles/
├── 文章1.md
├── 文章2.md
└── ...保存后刷新页面即可看到,无需重启服务。
Frontmatter 配置
每篇文章顶部必须包含 --- 包裹的 YAML 配置:
yaml
---
title: 文章标题 # 必填
description: 文章简介 # 选填,卡片摘要
date: 2026-06-09 # 必填,YYYY-MM-DD 格式
category: 前端 # 选填,默认"未分类"
tags: [Nuxt, Vue, CSS] # 选填
cover: https://xxx.jpg # 选填,自定义封面图
---字段说明
| 字段 | 必填 | 说明 |
|---|---|---|
title |
✅ | 文章标题 |
date |
✅ | 发布日期 |
description |
❌ | 文章简介,显示在卡片和 SEO |
category |
❌ | 分类,默认"未分类" |
tags |
❌ | 标签列表,用于筛选 |
cover |
❌ | 封面图,不填自动从正文提取 |
封面图优先级
- 手动指定
cover字段 → 优先使用 - 正文第一张 Markdown 图片
<img loading="lazy" decoding="async" src="url" alt="">→ 自动提取 - 正文第一张 HTML 标签
<img>或<image>→ 自动提取 - 都没有 → 卡片不显示封面
正文 Markdown 语法
标题
md
# 一级标题(同文章标题)
## 二级标题 → 自动加入右侧目录
### 三级标题 → 自动加入右侧目录(缩进显示)
#### 四级标题 → 不加入目录图片
md
# Markdown 格式(推荐)

# HTML 格式
<img src="https://图片链接.jpg" />代码
`md
const hello = 'world'
列表
md
- 无序列表项
- 无序列表项
1. 有序列表项
2. 有序列表项引用
md
> 这是一段引用文字完整示例
md
---
title: 我的新文章
description: 这篇文章介绍 xxx 的使用方法。
date: 2026-06-10
category: 前端
tags: [Vue, Nuxt, 教程]
cover: https://你的图床/cover.jpg
---

## 背景介绍
正文内容...
### 具体步骤
1. 第一步
2. 第二步
## 总结
总结内容...常用图床推荐
| 图床 | 特点 |
|---|---|
| SM.MS | 免费,API 支持 |
| 腾讯云 COS | 稳定,国内访问快 |
| GitHub + jsDelivr | 免费 CDN |
| img.remit.ee | Telegram 图床 |