使用环境:
- Node.js v16.9.0
- VScode v1.79.2
- Vue Language Features (Volar) v1.8,1
- TypeScript Vue Plugin (Volar) v1.8.1
- 项目所使用的TypeScript版本 v5.0.4
- vite v4.2.1
- vue v3.3.4
复现路径
进入vscode发现 .vue的文件都不能quick fixes,但是 .ts的文件确没有问题。
排查问题
起初以为是vscode的插件问题,然后就把所有的插件都关了,发现除了 Volar 插件插件会影响这个问题,其他的插件都不会影响,初步猜测是 Volar 插件影响的。
关了Volar插件之后的效果
可以发现Volar插件是完全影响 .vue 文件的,所以多半是 Volar 的配置影响的。
初始化一个新项目
发现新项目中 quick fix是完全可用的,从而可以知道可能是项目的 workspace 中的配置影响的。于是就打 开 Settings ,对比项目中 volar的配置。
对比到vue.codeActions.enabled
时发现了不同,原来是老项目把这个置为了false
,于是我马上打开,reload 了一下,发现问题就解决了!!!
问题探索
因为不清楚是什么时候把这个给关了,也不知道这个配置到底有啥用,于是就去 Volar 插件的 issue 中找答案。最后发现了这个Issue。发现就是我遇到的问题。问题细节可以看这个issue,我这里大概说一下我是怎么把这个开关给关了的。
当我保存文件的时候,编辑器右下角弹出了这个tooltip。
看起来就是 save 文件的时候,时间太长了(老版volar这个问题也被诟病),当时也没注意这个问题,我就顺手 disable 了,谁知道会间接把 quick fix 给搞没了。
为了解决这个问题,issue里面没啥好的办法,就是延长这个timeLimit,但是好像有些项目延长了,还是会有问题。好在是官方已经在解决这个问题了。
其实笔者并没从根本上了解清清楚 vue.codeActions.enabled
这个配置是干嘛的, quick fix 为什么会受到这个配置的影响,后续有知道原因的小伙伴欢迎在评论区分享,感谢!!!
总结
使用 vscode 的时候有些配置还是需要多注意有哪些影响,不然会给自己带来一些莫名其妙的问题,