vscode 开发vue项目<template>标签报错

项目已经开发很长时间了,一直没有问题,但是昨天新建了个项目,所以开发工具安装了下less支持,今天来打开以前的项目,发现template标签报错了,一脸懵逼,首先想的是先把less插件禁用,但是依然没有生效,后来怕了好长时间,才处理掉。

1,确认是否安装了vetur插件。

2,找到vscode的设置

3,按图找到json文件

 

4,添加如下配置

"files.associations": {
    "*.vue": "html"
}

 

5,搞定

  • 19
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 11
    评论
Vue中,<template>标签用于编写组件的模板部分,它可以包含HTML代码和Vue的模板法。在Vue2和Vue3中,<template>标签都被支持。 在Vue2中,<template>标签必须有一个顶级元素,也就是说,在<template>内部的内容必须被一个父元素包裹。这是因为Vue2使用了虚拟DOM来管理组件的渲染,而虚拟DOM要求每个组件只能有一个根节点。因此,如果你在<template>中写了多个元素,Vue2会自动将它们包裹在一个根元素内。 在Vue3中,<template>标签不再需要一个顶级元素的限制。这意味着你可以在<template>中直接写多个元素,而无需将它们包裹在一个父元素内。这个改变让组件的编写更加灵活和方便。 例如,下面是一个使用<template>标签的简单示例: <template> <div> <h1>{{ title }}</h1> <p>{{ message }}</p> </div> </template> 在这个示例中,<template>标签包含一个<div>元素,里面又包含一个<h1>元素和一个<p>元素。这样,我们就可以在组件中编写多个元素,而无需额外的包裹元素。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [vue3学习之路-<template标签](https://blog.csdn.net/Celester_best/article/details/127679521)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [vuetemplate模板法](https://blog.csdn.net/qq_54123885/article/details/131200910)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 11
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值