Claude 写的前端代码总爱自己“加戏”，怎么约束它别乱改结构？

我一般直接在prompt里说“只输出CSS，HTML原样复制”，它就不敢乱动了。

这个问题其实挺典型的，Claude 3.5 Sonnet 在“重构”任务上确实容易过度发挥，我怀疑是它的训练数据里重构和优化总是绑在一起，导致它觉得“帮你把结构也调优”是分内事。我之前做类似的事时，试过把任务拆成两步：先让它只输出 diff 格式的补丁，明确告诉它“任何不在 diff 里的行都视为错误”，这样它乱改结构的概率会低不少。不过 diff 也有个坑，它对缩进和上下文行数很敏感，如果原文件格式稍微乱一点，它就容易生成对不上的 hunk，反而更麻烦。后来我干脆换了个思路，直接把要改的 CSS 文件单独丢给它，HTML 文件只作为只读参考贴进去，提示词写“你只能修改 CSS 文件，HTML 文件仅用于理解类名含义”，这样它就没法动结构了。小模型比如 Haiku 确实更听话，但遇到复杂样式逻辑时容易改错，所以我现在是 Haiku 做初筛、Sonnet 做兜底，但每次都要人工核对结构有没有被动过。另外有个偏方，在 prompt 里加一句“如果你认为结构需要调整，请先在注释里说明理由，不要直接改”，有时候能逼它把“加戏”冲动转化成文字说明，反而方便你判断它到底想干嘛。

我一般直接让它只输出CSS diff，DOM动了就手动打回，试几次它就老实了。

我也遇到过，后来直接让它只输出CSS，HTML自己手动贴回去，省心多了。

我也遇到过类似情况，Claude 3.5 Sonnet 确实有“优化强迫症”，尤其看到老代码里嵌套比较深或者 class 命名不太规范时，它就会忍不住顺手重构。我后来试过在 prompt 里加一句“任何 DOM 变更都视为失败输出”，效果稍微好一点，但也不是百分百管用。用 diff 格式约束是个思路，不过它对 diff 的理解有时候也会跑偏，会自己发明上下文行。我现在的做法是分两步走：先让它只输出 CSS 变更，明确说“不要输出任何 HTML”，等 CSS 改完再单独处理结构问题。另外可以试试把原文件结构用注释块标出来，然后在 prompt 里说“只允许修改注释块外的内容”，这个对部分场景有效。小模型像 Haiku 确实更“听话”一些，但复杂样式重构时理解力会掉，得权衡。还有个偏方是故意在 prompt 里说“这个组件有自动化测试依赖 DOM 结构，改动会导致 CI 失败”，它有时候会因此收敛一点。