为什么我强制所有页面只能从一个文件拿数据

搭这个博客的时候，我给自己定了一条规矩：所有页面和组件都不准自己去拿文章内容，必须通过 lib/posts.ts 这个统一入口。

这条规矩看起来有点小题大做。毕竟现阶段文章内容就写在那个文件里，页面直接 import 那个数组，和通过函数拿，好像没什么区别。

区别在以后。假设我把文章标题直接写在 JSX 里：某天要把内容从手写数组换成 Markdown 文件，我就得翻遍所有页面，把每一处写死的标题、日期、摘要找出来改成读文件。如果页面有十处，就改十处；有一百处，就改一百处。这种改动没有任何创造性，却极易漏改和改错。

而如果所有内容都从 getPostList() 这类函数出来，那么换数据源时我只改 lib/posts.ts 一个文件。页面完全不知道数据从哪来，它们只负责把拿到的数据画出来。

这里面还有一个更隐蔽的点：数据入口不只包括「从哪拿」，还包括「以什么形状给」。所以我让函数返回已经切好的段落数组，而不是一整块带换行的字符串。否则页面就得自己解析换行，那等于把「内容格式的知识」泄漏到了 UI 层，以后换 Markdown 渲染器时照样要改页面。

为了让这条规矩不只是靠自觉，我把它做了两件事：一是写进 REQUIREMENTS.md，二是配了 ESLint 规则，禁止 app/ 和 components/ 下的文件直接 import 数据源或 fs。以后就算忘了，构建和 lint 也会提醒我。

结论：把「数据从哪来」和「界面长什么样」之间的边界划清楚，付出的成本是几分钟，省下的是以后整站重写的时间。