
这篇文章,通过一个真实的案例,给大家分享一下 Claude Code 的真实使用案例。分享之前,先来做一个小调查
原始需求:是有一位尊贵的付费用户,它希望我在文章中,增加文章的更改时间
这个需求咋眼一看,实现起来有点困难。因为我网站的文章,并没有存储在数据库,都是利用 next.js 的 SSG 来构建的。他压根就没有更新时间。
这里的一个技巧就是:在解决问题时,我们不要直接把原始需求喂给Claude Code,有如下几个原因
1、原始需求相对来说比较模糊,它有可能会理解偏差,如果一旦它理解偏差之后,最终虽然给你增加了一个时间,但是这个时间它不一定靠谱
2、Claude Code 的 Token 消耗是真的特别贵,因此,模糊的需求有可能会导致大量的 Token 被无意义的消耗掉
因此,我们要对原始需求进行一次拆解,我先在 deepseek 中咨询了一下,deepseek 给了我两个方案
1、文件构建时间,每次 build 时,我们需要获取文件的构建时间,但是 turbopack 的打包策略还有点不太一样,它每次构建时,文件的 hash 值都会更改,这个构建时间可能不太靠谱
2、git 提交的时间,我一想,这个应该是比较靠谱的
有了大致的解决方向之后,我就有了这个简单的提示词:把 git 提交时间编译在每一篇 .mdx 文章的头部

Claude Code 还是比较靠谱的,如果提示词比较精准,总体来说还是没啥毛病,嘎嘎就是一顿执行


在耗费了我 7 美元的额度之后,耗时 20 分钟左右,终于执行成功了。
不出意外的话,就出现意外了,它居然跳过了 171 个文件的更改.

这里一个很坑的地方就在这里,实际上这里被跳过的文件,仅仅只是额外传入了一个 pass 参数,其他都完全一样
<PostLayout pass>...
可是他不知变通,把多传的这个额外参数,定义成为了完全不同的自定义组件。然后就跳过不处理了 ~ ~
// 对于那 171 个被跳过的自定义 layout 文件,如果你也想添加 git 信息,需要手动修改它们的 layout.tsx,在调用 <Layout> 时传入 gitInfo 属性:
import Layout from'components/post-layout';
import { getGitFileInfo } from'@/utils/git-info';
exportdefaultfunctionArticle({ children }: any) {
const gitInfo = getGitFileInfo('src/app/你的路径/page.mdx');
return (
<LayoutgitInfo={gitInfo || undefined}>
{children}
</Layout>
);
}
但是真实的情况是,我需要的结果是这样,运行的结果是完全一致的。
import MdxLayout from'components/mdx-layout';
exportdefaultfunctionArticle({ children }: any) {
return (
<MdxLayoutpassfilePath="src/app/r19base/(4.compiler)/23.compilerlower/page.mdx">
{children}
</MdxLayout>
);
}
然后这个时候,我就在提示词上面,踩了一个坑
我再次输入提示词:使用跟上面一样的方式把跳过的 171 个文件重构一下
我的这个表达呢,细想一下它有一点歧义。因为 Claude Code 已经给了我一个建议的方案,但是我不认可这个方案,我的本意是,用已经修改了的几百个文件那样的方案修改被跳过的文件,但是在执行的过程中,被它理解成为了:上面它给我建议的那个方案
这一点歧义,直接导致它按照我不想要的方案嘎嘎执行了 20 分钟,中间还出现了 2 次错误自我修复,嘎嘎猛吞我的 token,两种歧义开始打架导致了错误。
最终我又不得不重新放弃这次执行,重新明确我的语义。
总结
1、提示词之中,最好能够包含相对稳定准确的解决方案,让 AI 思考得越少越少,这样能减少幻觉率。
2、需求的提示词里一定不要有歧义,有歧义容易导致出错,虽然 Claude Code 最终可以修复,但是这样会造成大量的 token 消耗。并且由于 LLM 是基于预测机制产出结果,早期的误读、歧义等,都会导致后续的每一步都在错误的方向上越走越远,并且它还会尝试逻辑自洽,生成一些不存在的东西,越写问题越大,也增加开发者的审核难度,如果你被它的幻觉骗过去了,那就会造成严重的后果
3、自然语言的约束力度不如代码精准、在提示词中,包含文件名、代码变量、代码专有词、专业术语等,会极大的减少 Cluade Code 的幻觉
推荐阅读
1、React 哲学
2、React 19 基础
3、爆锤面试官之 React 原理面试
4、zustand