idea中在html页面中写Vue代码没有提示和高亮

idea中在html页面中写Vue代码没有提示和高亮

针对于这一问题,首先需要下载插件Vue.js,
File>Setting>Plugins,在插件市场中搜索Vue.js,安装一下。有可能会出现搜索转圈圈、下载慢等问题,一般都是网络问题,可以连上手机热点,再来试试(亲测有效)
在这里插入图片描述


第一种解决方法比较简单:
在setting中找到Editor>File Types>Vue.js Template,然后点击加号,添加*.html,即.html认为vue可识别
在这里插入图片描述
创建test.html文件发现,vue代码块成功提示并高亮。但是凡是html文件的图标都变成的vue的文件的显示图标,但这个没有什么影响。
在这里插入图片描述


第二种方式:

可以不需要下载插件Vue.js,仅作语法上的提示。和方法一一样也是修改file types,不过是修改HTML,添加上*.vue,即HTML认为.vue可识别。注意如果你尝试过第一种方式,那么这里你HTML应该会缺少*.html,重新补上
在这里插入图片描述
然后找到Editor>Inspections>HTML>Unknown HTML tag attribute,将原来内容删去,复制如下内容,添加新的标签库内容

@tap,@tap.stop,@tap.prevent,@tap.once,@click,@click.stop,@click.prevent,@click.once,@change,@change.lazy,@change.number,@change.trim,v-model,v-for,v-text,v-html,v-if,v-else-if,v-else,v-pre,v-once,v-bind,scoped,@keyup.enter,:class,:style,v-show,:key,@keyup,@submit,@submit.prevent,@mouseenter,@mouseleave,@mouseout,@mouseover

在这里插入图片描述
创建html文件后发现这种方式也可以弹出代码提示并且文件图标也没有变,但是没有vue语法高亮。
在这里插入图片描述
这种方式还有一个严重的问题,就是因为是自己添加的标签库,对于有一些标签仍然不能够识别和匹配,代码会报红,这个时候只需要为其添加命名空间即可(alt+enter)
在这里插入图片描述
在这里插入图片描述

  • 34
    点赞
  • 71
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值