必须安装Volar插件并禁用WebStorm自带Vue.js插件，配置正确tsconfig.json（含"types": ["vue"]和完整include路径），重启IDE后才能支持defineComponent类型推断、script setup智能提示及模板变量跳转。
WebStorm 开箱即用 Vue 3 项目，但默认不启用关键语言支持——defineComponent 无类型推断、<script setup> 里 ref 不提示、模板中 v-model 绑定变量标红，本质是没配 Volar。
必须装 Volar，禁用自带 Vue.js 插件
WebStorm 自带的 “Vue.js” 插件只支持 Options API 和基础高亮，对 <script setup lang="ts"> 完全无效。Volar 才是 Vue 3 SFC 的官方语言服务提供者。
- 打开 Settings/Preferences → Plugins，搜索并安装
Volar（不是Vetur，那是 Vue 2 的） - 在已安装插件列表中，找到并 禁用 WebStorm 自带的
Vue.js插件（它和 Volar 冲突，会导致类型丢失） - 重启 WebStorm——这步不能跳，Volar 需要完整重载语言服务才能接管 .vue 文件
- 验证：打开任意
.vue文件，在<script setup lang="ts">中写const count = ref(0)，按Ctrl+Click（Win）或Cmd+Click（Mac）能跳转到ref类型定义，说明生效
tsconfig.json 必须被 WebStorm 正确识别
WebStorm 不会自动把 tsconfig.json 当作整个项目的类型根。尤其用 Vite 创建的项目，常有多个配置文件（tsconfig.json、tsconfig.app.json、tsconfig.node.json），而 WebStorm 默认只读最外层那个。一旦路径或 include 配错，defineProps 就无法推导类型，useRouter 标红。
- 确认项目根目录存在
tsconfig.json，且内容至少包含"types": ["vite/client", "vue"]和"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"] - 进入 Settings/Preferences → Languages & Frameworks → TypeScript，检查
Compiler是否设为Use TypeScript version specified in the tsconfig.json，且路径指向你项目的tsconfig.json - 如果仍报
Cannot find name 'defineProps'或类似错误，右键项目根目录 →Reload project from tsconfig
运行配置别依赖终端命令行
每次手动开终端输 npm run dev 效率低，还容易漏环境变量或路径问题。WebStorm 可以直接集成 npm script，启动时自动注入 Node.js 运行时和工作目录。
审查 Vue 管理后台的变更请求（Vue 2 + Element UI，Vue 3 + Element Plus）。重点关注最小化变更实现、上线风险检查以及回归检查清单生成。
立即学习“前端免费学习笔记（深入）”；
- 点击右上角
Add Configuration→+ → npm - 填入：
Package directory指向项目根目录；Command填run；Scripts选dev（对应package.json里的"dev": "vite"） - 勾选
Run npm install automatically before running this script，避免依赖未装就启动失败 - 启动后，控制台输出应含
Local:地址，且 WebStorm 底部状态栏显示Running，而非卡在npm start报错
ESLint + Prettier 要关掉 WebStorm 自带校验
WebStorm 自带的 JavaScript 语法检查器和 ESLint 插件会打架，尤其当你用了 @vue/eslint-config-typescript 后，defineProps 可能被误判为未声明变量。
- 进 Settings/Preferences → Languages & Frameworks → JavaScript → Code Quality Tools → ESLint，启用
Automatic ESLint configuration，路径指向项目内eslint.config.js或.eslintrc.cjs - 关闭 Settings/Preferences → Editor → Inspections → JavaScript → General → Unresolved variable（它和 ESLint 重复报错）
- Prettier 配置同理：进 Code Style → JavaScript → Prettier，勾选
Run on save，但取消勾选On code reformat，避免格式化和 ESLint 修复冲突
最易忽略的是 tsconfig.json 的 types 字段漏了 "vue"，或者 Volar 启动后没重启 IDE——这两处一错，整个 <script setup> 就退化成纯文本编辑器。
