Vue + Nuxt 做内容站,看起来门槛不高:
- 页面能写
- Markdown 能读
- 部署也不复杂
但只要站点开始持续更新,很快就会出现三个问题:
- 文章、专题页、导航配置混在一起
- 内容更新必须依赖开发
- 发布后出了问题,没人知道该回滚哪里
如果你已经看过 Nuxt Content 指南、网页内容如何做到不改代码也能更新、网页制作从 0 到上线 和 前端框架选型指南,这篇会更聚焦:怎样把内容站搭成一个能持续发布的系统。
一、先把内容站分成 3 层,不要都堆在 pages 里
很多 Nuxt 新手最容易犯的错,是把所有逻辑都放到页面层。文章页、列表页、专题页、SEO 配置、导航配置,最后全挤在一起。
更稳的分法是三层:
| 层级 | 负责什么 | 常见内容 |
|---|---|---|
| 展示层 | 页面与组件 | 首页、文章页、专题页、目录页 |
| 内容层 | 可被运营修改的数据 | Markdown、JSON、专题配置 |
| 规则层 | 生成、校验、发布规则 | 路由、SEO、构建脚本、校验逻辑 |
这样分的好处是:
- 页面结构调整不会污染内容源
- 内容更新不一定需要改组件
- 发布出错时更容易定位是内容问题还是模板问题
二、目录设计要先服务“发布”,不是只服务“开发体验”
一个适合长期维护的内容站,目录至少要回答四个问题:
- 文章放哪
- 专题页配置放哪
- 公共 SEO 逻辑放哪
- 发布校验脚本放哪
一个常见且清晰的结构可以是:
| 目录 | 用途 | 维护者 |
|---|---|---|
| content | 文章与专题原始内容 | 编辑、运营、开发 |
| components | 页面块与复用组件 | 开发 |
| pages | 路由入口 | 开发 |
| composables / utils | 查询、格式化、内容组装 | 开发 |
| scripts | 发布前校验、批量修复、导出脚本 | 开发 |
关键点不是名字,而是边界。内容团队改文章时,不应该频繁碰到页面逻辑。
三、内容模型别只想“能显示”,要想“能扩展”
内容站最怕的是今天只需要标题和正文,明天突然要加:
- 作者信息
- 阅读时长
- 封面图
- FAQ
- 相关文章
- 更新日期
如果前期完全没设计 frontmatter,后面补字段会越来越痛。
建议每篇内容至少稳定保留这些字段:
- title
- description
- date
- topic
- tags
- image
- imageAlt
- readingTime
如果你确定会做专题聚合,再加:
- featured
- series
- relatedTopics
这会让列表页、专题页、站内推荐都更容易自动化。
四、发布流程一定要分成“内容发布”和“结构发布”
很多团队所有变更都走同一条上线链路,这会导致轻量更新也变得很重。
更实际的做法是分两种:
1. 内容发布
改文章、改封面、补 FAQ、调整摘要。这类变更应该优先走低风险流程:
- 内容校验
- 预览
- 发布
- 结果检查
2. 结构发布
改布局、改组件、改路由、改 SEO 模板。这类变更才需要更严格的开发评审和回归测试。
把两类流程拆开,运营效率会高很多。
五、Nuxt 内容站上线前最该校验的不是“能不能打开”
能打开只是最底线,真正影响长期发布效率的是下面这些校验:
| 校验项 | 为什么重要 | 最低标准 |
|---|---|---|
| frontmatter 完整 | 避免列表、SEO 模块报空 | 标题、描述、图片、日期齐全 |
| 路径一致 | 避免旧链接失效 | slug 规则固定 |
| 内链可用 | 避免专题页形成死链 | 关键内链无 404 |
| 封面图存在 | 避免构建后页面空白 | 图片路径和文件一致 |
| 标题层级正常 | 避免内容结构混乱 | 页面仅一个 H1 |
你可以把这些校验做成脚本,放到发布前自动跑,而不是靠人工逐篇检查。
六、失败案例:内容站越做越慢,不是因为内容多,而是因为结构没分层
一个常见问题是:
- 文章越来越多
- 每次发文都要改导航或手写推荐位
- 文章封面丢失时只有上线后才发现
- 运营想改摘要,还是得找开发改代码
这类问题表面看是“流程不顺”,根因通常是:
- 内容模型没固定
- 目录职责不清
- 没有发布前校验
- 推荐、聚合、SEO 配置过于依赖手写
修复思路不是继续加人,而是先把内容系统标准化。
七、一个适合中小团队的最小发布链路
如果你的团队还不大,可以先做到这 6 步:
- 编辑提交内容文件
- 自动校验 frontmatter 和图片路径
- 自动生成预览环境
- 运营或编辑检查页面展示
- 合并发布
- 发布后检查索引页、文章页、封面图和元信息
这已经能解决大多数“内容站更新越来越痛”的问题。
八、内容站目录与发布流程检查清单
- 内容、展示、规则三层是否已经分开
- frontmatter 字段是否固定且可扩展
- 内容发布和结构发布是否区分开
- 发布前是否自动检查图片、路径和标题层级
- 相关文章、专题聚合是否依赖结构化字段而不是手写
- 出问题时是否能快速判断是内容错误还是模板错误
结语
Vue + Nuxt 做内容站的真正难点,不在写页面,而在持续发布。
当目录结构、内容模型和发布流程都稳定下来,内容站才会从“一个能跑的网站”变成“一个能持续增长的系统”。如果这三件事没处理好,后面任何增长动作都会越来越重。


