VSCode .vue 文件 html css 无智能提示

2023-06-10 05:37| 来源: 网络整理| 查看: 265

在 VSCode v1.15.1 版本之后，.vue 文件输入 html css 不会智能提示，

那么需要通过 VSCode 插件安装 HTML Snippets 或者 vetur 插件。

然后找到 VSCode 设置里面的 settings.json，直接搜索这个文件即可。

打开 settings.json 配置

{ "workbench.sideBar.location": "left", "window.zoomLevel": -1, "editor.suggest.snippetsPreventQuickSuggestions": false, "emmet.triggerExpansionOnTab": true } 复制代码

我这边打开之后默认是上面这样的

然后添加配置:

{ "emmet.triggerExpansionOnTab": true, "emmet.includeLanguages": { "vue-html":"html", "vue":"html" }, "files.associations": { "*.vue": "html" } } 复制代码

最终显示：

{ "workbench.sideBar.location": "left", "window.zoomLevel": -1, "editor.suggest.snippetsPreventQuickSuggestions": false, "emmet.triggerExpansionOnTab": true, "emmet.includeLanguages": { "vue-html":"html", "vue":"html" }, "files.associations": { "*.vue": "html" } } 复制代码

安装插件且配置好之后就可以去 .vue 文件中编写 html css 了且都会带智能提示。

补充：还有个问题就是在使用 VSCode 创建了 .vue 文件之后，Vue 的插件，比如 vue，vue-beautify，vue-color，VueHelper，vertur 等等，可能会在 .vue 文件中使用无效，那么你需要修改一下 VSCode 右下角的文件类型。

它显示的类型竟然是 html，那么你需要点击它，在弹出的框中修改为 Vue 即可。

【本文地址】

公司简介

联系我们