IntelliJ IDEA 需安装官方 Volar 插件、禁用内置 Vue.js 插件、正确标记 Vue 项目并关闭实验性功能，才能支持 Vue 3 Composition API 基础开发；模板中 ref 仍需 .value 是当前限制。
IntelliJ IDEA 默认不提供 Vue 的实时语法高亮、组件跳转和模板内响应式推导，但通过正确配置插件和项目结构，能接近 VS Code + Volar 的体验——关键不是“像不像”，而是“哪些功能必须开，哪些可以妥协”。
装对插件：Vue.js 插件 ≠ Volar
IDEA 自带的 Vue.js 插件只支持 Vue 2 和基础 Vue 3 Options API，对 Composition API（setup()）和 <script setup></script> 的类型推导很弱，也不支持模板中 ref / computed 的自动补全。
- 必须额外安装
Vue Language Features (Volar)插件（JetBrains 官方维护，非第三方） - 禁用默认的
Vue.js插件（否则两者冲突，导致模板中v-model报红、@click无提示） - 确保项目根目录有
tsconfig.json或jsconfig.json，Volar 依赖它做类型服务
项目要识别为 Vue 项目：别让 IDEA 当成纯 HTML
IDEA 不会自动根据 package.json 中的 dependencies 推断框架类型。如果没手动标记，它会把 .vue 文件当普通文本，连基本高亮都没有。
- 右键项目根目录 →
Mark Directory as→Resources Root（仅静态资源）不行；必须选JavaScript Libraries？不对 —— 正确操作是：Open Module Settings→Modules→ 选中模块 → 右侧勾选Vue.js（此时需已启用 Volar 插件） - 或者更直接：打开任意
.vue文件，底部状态栏点击Vue，选择Vue.js语言模式（临时生效），再进File → Project Structure → Modules固化 - 若用 Vite 创建项目，确保
vite.config.ts中没有删掉vue()插件，否则 IDEA 无法识别 SFC 解析逻辑
模板里 ref() 不自动解包？关掉 Experimental Features
VS Code + Volar 默认开启 Experimental Features（如 semanticTokens、inlayHints），但 IDEA 的 Volar 实现尚未完全兼容，开了反而导致模板中 {{ count }} 报错 “Cannot find name 'count'”，尽管 setup() 里明明写了 const count = ref(0)。
Element Plus Vue3 桌面组件库。在开发 Vue 3.x 页面时调用，使用 Element Plus 组件（如 el-button、el-input、el-form、el-table 等）。
立即学习“前端免费学习笔记（深入）”；
- 进
Settings → Languages & Frameworks → JavaScript → Libraries → Vue.js - 取消勾选
Enable experimental features - 重启 IDEA（不是重载项目）
- 此时
ref在模板中仍需写count.value才不报错 —— 这是当前 IDEA + Volar 的限制，不是你配错了；想免.value，只能切回 VS Code 或等 JetBrains 下个大版本升级
热更新失效或 HMR 卡住？检查运行配置类型
IDEA 内置的 npm 运行配置不会自动绑定 Vite/HMR 的 WebSocket，容易出现改了代码但浏览器不刷新，或控制台报 Failed to fetch dynamically imported module。
- 不要用
npm run dev的通用脚本配置；改用Run → Edit Configurations → + → Vite.js（需安装Vite插件） - 确认
Command填的是dev（不是serve或空），且Working directory指向项目根 - 如果用 pnpm，确保
Node interpreter指向 pnpm 全局二进制（而非 npm），否则vite命令找不到
最常被忽略的一点：IDEA 对 <script setup lang="ts"></script> 的泛型支持（比如 defineProps()）仍弱于 Volar 在 VS Code 中的表现，类型错误可能延迟数秒才标出，甚至漏标 —— 别反复重启，这是当前能力边界，不是配置问题。
