live templates是唯一可靠路径，需在settings→editor→live templates中配置vue3缩写模板，含及带占位符的defineprops/defineemits，并限定作用域为vue files，才能实现光标跳转至泛型位置。
Live Templates 是唯一能用的路径
WebStorm 内置的 New → Vue Component 菜单项只生成 Vue 2 风格的 export default { } 空壳，对 <script setup></script> 项目完全无效。File and Code Templates 生成的是静态文件，不支持光标跳转、泛型占位或上下文感知——它连 defineProps}>() 里的光标停靠都做不到。只有 Live Templates 能真正提效。
配置 vue3 缩写模板的实操细节
进入 Settings → Editor → Live Templates → + → Live Template：
-
Abbreviation填vue3（别用vue，那是旧模板） -
Template text必须保留换行和缩进，内容如下：
<template><div></div>
</template><p><script setup lang="ts">
const props = defineProps<{<!-- -->}>()
const emit = defineEmits<{<!-- -->}>()
</script></p><p><style scoped>
</style></p>
点击 Define → 勾选 Vue Files（仅勾 HTML Files 不生效）
保存后，在任意 .vue 文件中输入 vue3 + Tab，光标会自动停在第一个 <!-- --> 处，直接写 title: string; disabled?: boolean，再按 Tab 跳到第二个泛型处写事件签名。
为什么 props 泛型报红或没提示
这不是代码错，是 IDE 配置断层：
- 右下角状态栏没显示
Vue→ 检查是否启用了Volar，并已关闭Vetur -
tsconfig.json里缺"types": ["vue"]→ 补上，否则defineProps泛型无法解析 - Live Templates 作用域没勾
Vue Files→ 即使缩写输对了，也不会触发 - 当前文件不是
.vue后缀，或光标不在<script setup></script>区域内 → AI 补全或类型推导会失效
AI 辅助生成前必须确认的三件事
CodeGeeX 或 WebStorm 自带 AI 并不可靠，尤其对 Composition API：
- 模型必须选
CodeGeeX-1.5-Chat，默认免费模型对ref.value、onMounted等识别准确率低于 60% - 必须开启
Enable project context，让 AI 读取tsconfig.json和node_modules/vue类型定义 - AI 只在
<script setup></script>块内响应，且不会自动补全import—— 如果它漏了ref，你得自己加
最稳的路径永远是：先用 vue3 + Tab 拉出骨架，再让 AI 在已有结构里补逻辑，而不是让它从零造轮子。
