必须安装 jetbrains 官方出品的 vue.js 插件（作者为“jetbrains”），在 settings → plugins → marketplace 中搜索“vue.js”（严格大小写、无空格、非 volar/vetur），搜不到则手动下载 vue-for-idea 或 vuejs-plugin 的 .jar 文件导入，安装后必须点击 restart ide 重启生效。
必须装官方 Vue.js 插件并重启 IDE，否则高亮、跳转、模板新建全失效——装完不重启，等于没装。
装哪个插件？别搜错名字
打开 File > Settings > Plugins，在 Marketplace 搜索框里输入 Vue.js（注意大小写、无空格、不是 Volar 也不是 Vetur）。只装 JetBrains 官方出品的那个，作者是 “JetBrains”。
如果搜不到，说明网络受限，可手动下载：
• 点击 Browse repositories → 切换到 GitHub 标签页
• 搜索 vue-for-idea（社区维护较活跃）或 vuejs-plugin
• 下载 .jar 后用 Install plugin from disk… 导入
装完必须重启，否则所有功能都不工作
安装完成后，别急着点 OK 或 Apply，一定要点右下角的 Restart IDE。
验证是否真正生效，只看两个信号：
• 项目树中任意 .vue 文件左侧显示 Vue 官方 Logo 图标（不是文件夹或 HTML 图标）
• 右键 → New 或 File > New 里出现 Vue File 模板选项
缺一个，就说明没重启成功，或插件版本与 WebStorm 不兼容（2026 年主流用 WebStorm 2025.3+，对应插件需 ≥ 243.x）
审查 Vue 管理后台的变更请求（Vue 2 + Element UI，Vue 3 + Element Plus）。重点关注最小化变更实现、上线风险检查以及回归检查清单生成。
文件类型必须绑定到 Vue Component，不能留在 HTML 里
即使插件装了、也重启了，如果 .vue 还被当 HTML 解析，<script setup></script> 会报红、defineProps 无提示、<style scoped></style> 不识别。
正确做法：
• 进入 Settings > Editor > File Types
• 左侧列表找到 Vue Component（不是 HTML，也不是 Vue.js Template）
• 确保右侧 Registered Patterns 包含 *.vue；没有就手动点 + 加入
• 顺手删掉 HTML 类型下的 *.vue（这个旧绑定会劫持解析路径）
改完不用重启，但得重新打开已存在的 .vue 文件才能刷新识别状态，左下角应显示 Vue Component
高亮“有颜色但没智能”？那是 TypeScript 配置没读进去
基础语法高亮靠插件，但 ref() 和 computed() 的颜色区分、props 类型推断，全依赖 WebStorm 正确加载 tsconfig.json。
关键动作：
• 确认项目根目录有 tsconfig.json，且 "compilerOptions" 至少含："jsx": "preserve"、"lib": ["esnext", "dom"]、"target": "esnext"
• 进入 Settings > Languages & Frameworks > TypeScript，检查 TypeScript language service 是否启用，Node interpreter 和 TS version 必须指向项目本地的 node_modules/typescript
• 若看到 TypeScript is not configured 提示，点右上角 Reload project
做完后，在 <script setup></script> 里写 const count = ref(0)，观察 ref（函数调用）、count（变量声明）、0（字面量）是否颜色分明
最容易被忽略的是：文件类型绑定和 TypeScript 配置这两步，它们不依赖插件重启，但一旦漏掉，高亮就永远停留在“蓝一片”的原始阶段。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
