Vue 3 项目里 vetur 装上了,插件列表显示已启用,可 .vue 文件里 template 还是白字,Ctrl 点击组件也跳不过去,控制台一直提示找不到 typescript 模块。
这不是配置写错了,是 vetur 本身只认 Vue 2。Vue 3 的编译器和类型系统都换了,vetur 那套解析走不通。
Vue 3 用 Volar
现在的对应插件叫 Vue - Official,就是以前的 Volar。装上之后编辑器会提示切换版本,Vue 3 项目选 3.x 模式,模板类型检查、跳转、补全都能用。
它和 vetur 不能同时开。两个都装会把 .vue 文件抢来抢去,症状是补全重复、保存时格式化两遍,或者干脆失效。禁用要连用户级一起禁,只关当前工作区,下次开新窗口又回来了。
- takeover 模式打开后才会接管内置的 TS 服务,不开模板里全是 any。
- 项目的 tsconfig 要把 vue 文件包含进去,类型才认。
- 团队里插件版本不一致,常常出现同事能跳、你跳不了,对一下版本号最快。
从 vetur 切过来,大项目第一次打开会先建类型索引,CPU 占满一两分钟,模板提示要等它跑完才准。等不及就关掉窗口重开,右下角的进度条能看清它卡在哪一步。
留在 Vue 2 的话
老项目继续用 vetur 没问题,但要处理 vetur.config.js。默认它扫描整个工作区,monorepo 下几十个包全扫一遍,打开就卡,风扇一直响。用 projects 字段只指向当前包,启动快很多。
格式化默认走 prettier,规则和项目里的 eslint 经常打架,保存时一改就冒红波浪线。把 vetur.format.defaultFormatter 里对应语言的格式化关掉,交给 eslint 的自动修复处理,冲突就没了。
判断方法很直接:package.json 里 vue 是 3 开头就用 Volar,别折腾 vetur。2.7 的项目上 Volar 勉强能跑,但配套的类型工具不齐,还是老实留着 vetur 省心。