运行vue项目时报错The template root requires exactly one element

最新推荐文章于 2024-07-25 15:05:13 发布
最新推荐文章于 2024-07-25 15:05:13 发布
阅读量1.4k 收藏 3
点赞数 2
文章标签： vscode vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44999716/article/details/113704454
版权

运行vue项目时报错The template root requires exactly one element

在终端输入npm run serve运行vue项目后，报错The template root requires exactly one element，解决方案：

第一步：先看是否安装了Vetur插件，没有安装的话按照下图安装一下，下图用的是vscode软件

在这里插入图片描述

第二步：安装好了Vetur插件后，依次点击文件=》首选项=》设置，然后在最上面的输入框内输入eslint来搜索 Vetur的验证模板，取消勾选Validate vue-html in using eslint-plugin-vue（把对勾取消掉，像图片上一样）

在这里插入图片描述

在这里插入图片描述

煜成'Studio
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
Vue报错 The template root requires exactly one element
TOP的博客
01-07 2013
Vue报错 The template root requires exactly one element. Vue2解决 因为vue的模版中只能有一个根节点，由于不支持多根节点组件，所以在<template>中插入第二个元素就会报错，将<template>中的元素用一个大的<div>包起来，这样就可以在其中添加多个元素了 Vue3解决 在 3.x 中，组件可以包含多个根节点！但是为什么还会报错呢 是因为插件vetur设置了校验规则，改一下配置规则就不会显现错误了
Vue项目报错：Uncaught SyntaxError: Unexpected token <
10-17
主要介绍了Vue项目报错：Uncaught SyntaxError: Unexpected token <，在引入第三方依赖的 JS 文件时，遇到的一个问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue3报错The template root requires exactly one element
曈欣的博客
11-18 2695
vue3 项目报错：The template root requires exactly one element，大概意思是模板根目录下只需要一个元素。根目录下只能有一个跟元素，是 Vue2的要求，Vue3 中已经去掉了这个限制。那么如何解决这个错误提示呢？
解决Vue3项目使用多个根标签提示[vue/no-multiple-template-root]The template root requires an element rather than
qq_45569925的博客
05-29 362
报错截图 检查原因 第一步：检查是否安装了Vetur插件 第二步：左下角设置图标 ==》 设置 第三步：进入设置页面搜索 eslint 把 Vetur 的验证模板，取消勾选Validate vue-html in using eslint-plugin-vue 第四步：将错误提示页面关掉然后重新打开，即可正常显示
vue3项目报错The template root requires exactly one element.eslint-plugin-vue
qq_43383334的博客
10-26 876
建议使用带有我们官方扩展 Volar (opens new window) 的 VSCode，它为 Vue 3 提供了全面的 IDE 支持。1.禁用 Vetur 并改用Volar=》它现在是 Vue 3 项目的官方推荐。2.package.json文件中。
【前端2】vue 报错：The template root requires exactly one element
定期分享我的发现和想法，感谢你的陪伴和支持
07-03 1125
封面图内含彩蛋 ~ 原因： Vue2要求模板中的``中只能有一个根元素，也就是说最外层不能同时包含其他元素或者文本。如果模板中出现多个根元素，就会触发这个错误。 解决： vue2：所以，删除多的根元素，or在最外层再加一个div包裹其他根元素 vue3中，则去掉了这个限制。引入了一个新的特性叫做 Fragment，这允许我们在不需要额外的 DOM 元素的情况下使用多个根元素。
vue3报错：The template root requires exactly one element
weixin_52648900的博客
05-30 497
解决 vue3 根组件 在 vscode 中报错
vue3项目中eslint报错 The template root requires exactly one element解决办法
TangAcrab的博客
03-21 2375
示错： vue2的项目中，template中的东西必须通过使用一个根元素来进行包裹； 解决办法： vue3 项目中，vue相关插件使用 Volar; vue2项目中，使用插件Vetur 禁用Vetur，在当前工作区禁用。以防止影响到其他项目Vetur的使用； 开启Volar 不再报错 ...
vue3报错：The template root requires exactly one element终极解决办法
热门推荐
Y_soybean_milk的博客
04-22 2万+
兴冲冲的开启一个vue3项目，控制台却报错The template root requires exactly one element 我们知道，在vue2中，template中只能有一个根元素，但在vue3中，则去掉了这个限制 那么如何解决这个错误提示呢？ 方法一 可能是项目中引入的eslint报的错 解决方法：在项目的.eslintrc.js配置文件的rules中添加："vue/no-multiple-template-root": "off" rules: { 'no-console':
Vue3 在VSCode新建项目报错The template root requires exactly one element.解决方法
bigniu的博客
12-22 1万+
Vue3 [vue/no-multiple-template-root] Vue3 Vscode报错 Vue3 新建项目报红 The template root requires exactly one
【Vue报错】在vscode里报错The template root requires exactly one element的解决方案
weixin_45388918的博客
09-07 1570
使用VScode创建vue项目时，加载了vetur插件。vetur按照了Vue2的标准所以报错。Vue2 中只允许里存在一个根节点。但是vue3中可以存在多个根节点。标签，之后所有的组件全部加在。1、在 中添加一个。
解决vue项目运行npm run serve报错的问题
01-18
先来一张报错的截图 先去配置环境变量 C:\Users\lgd\AppData\Local\Programs\Microsoft VS Code\bin的后面配置 ；%SystemRoot%\system32;...补充知识：vue npm run serve报错Cannot find module ‘eslint-plugin
创建项目时VUE报错的解决办法
02-25
创建项目时VUE报错的解决办法
安装vue-cli报错 -4058 的解决方法
08-29
主要介绍了安装vue-cli报错 -4058 的解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue踩坑记-在项目中安装依赖模块npm install报错
10-17
主要介绍了vue踩坑记-在项目中安装依赖模块npm install报错，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
VSCode 命令行使用 git commit 无法输入中文
最新发布
weixin_52648900的博客
07-25 354
非常详细的方法解决 git commit 无法输入中文的问题哦
vscode-CodeGeeX AI在vscode运用
2301_76671906的博客
07-24 333
CodeGeeX AI在vscode运用
我在Vscode学Java泛型（泛型设计、擦除、通配符）
m0_74154295的博客
07-24 994
通过使用泛型，可以在方法中处理不同类型的数据，而不需要重载多个方法、 泛型核心意义在于 类属性或方法的参数在定义数据类型时，可以直接使用一个标记进行占位 ，在具体使用时才设置其对应的实际数据类型，这样当设置的数据类型出现错误后，就可以在程序编译时检测 来。
error The template root requires exactly one element vue/valid-template-root
07-28
这个错误通常发生在Vue模板中，它表示模板根元素必须包含且只能包含一个元素。Vue模板需要一个根元素来包裹模板中的所有内容，以确保正确的渲染。如果你的模板中有多个根元素，就会出现这个错误。 为了解决这个问题，你可以在模板的根元素外面再添加一个包裹元素，使得模板只有一个根元素。例如，你可以使用一个 `<div>` 元素将所有内容包裹起来。以下是一个示例： ```html <template> <div> <!-- 这里是你的模板内容 --> </div> </template> ``` 通过将内容包裹在一个单独的元素中，你就可以避免出现 "The template root requires exactly one element" 的错误。记得确保你的模板只有一个根元素，并且在根元素之外没有其他直接子元素。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值