告别 Vue3 项目 AI 乱码：AI 编码助手规范实战

用 AI 写 Vue3 代码最头疼的事：代码跑得通，但类型全是 any，命名不规范，组件拆分一塌糊涂。一开始以为是 AI 能力问题，后来发现是约束不够。

核心问题出在哪

AI 不知道你的项目规范，不知道你们团队的命名约定，不知道你们prefer composition API还是 options API。

我们的解法

第一步：TypeScript 严格模式

// tsconfig.json
{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true
  }
}

开启严格模式后，AI 必须返回完整类型签名，乱来的成本高了。

data-ad-format="fluid" data-ad-layout-key="-7k+ex-4a-9w+4a">

第二步：ESLint 规则定制

加了两条规则：

• no-any：禁止隐式 any
• consistent-component-imports：强制组件按固定方式引入

第三步：Prompt 里写清楚你们的”规矩”

每次新建项目，把 CONTRIBUTING.md 喂给 AI，里面写清楚命名规范、目录结构、TypeScript 要求。AI 会自动遵守。

效果

三个月跑下来，AI 生成代码的一次规范率从 40% 提到了 78%。不是 AI 变强了，是约束变多了。

对 AI 编码助手的期待要调整：规范先行，AI 跟上。