entityMap|0|type|LINK|mutability|MUTABLE|data|url|https://github.com/vuejs/vetur/issues/2299#issuecomment-696015374|blocks|key|d92n1|text|我最终关闭了Vetur+linting。Vetur认为它是一个Vue+2项目，因为它在VS+Code工作区中。|unstyled|depth|inlineStyleRanges|entityRanges|2aem9|offset|length|cstso|您可以通过执行以下操作来解决此问题|duaab|F1>Preferences:Open+Settings+(JSON)|code-block|syntax|javascript|cojlu|粘贴|dpgon|"vetur.validation.template":+false,
"vetur.validation.script":+false,
"vetur.validation.style":+false,|bocvd^0|0|0|1T|0|0|0|0|0|0^^$0|$1|$2|3|4|5|6|$7|8]]]|9|@$A|B|C|D|2|E|F|X|G|@]|H|@]|6|$]]|$A|I|C|8|2|E|F|Y|G|@]|H|@$J|Z|K|10|A|11]]|6|$]]|$A|L|C|M|2|E|F|12|G|@]|H|@]|6|$]]|$A|N|C|O|2|P|F|13|G|@]|H|@]|6|$Q|R]]|$A|S|C|T|2|E|F|14|G|@]|H|@]|6|$]]|$A|U|C|V|2|P|F|15|G|@]|H|@]|6|$Q|R]]|$A|W|C|-4|2|E|F|16|G|@]|H|@]|6|$]]]]

I ended up turning off Vetur linting. Vetur thinks that it is a Vue 2 project becuase it is in a VS Code workspace.
<a href="https://github.com/vuejs/vetur/issues/2299#issuecomment-696015374" rel="noreferrer">https://github.com/vuejs/vetur/issues/2299#issuecomment-696015374</a>
You can solve this by doing
<pre><code>F1&gt;Preferences:Open Settings (JSON)
</code></pre>
paste
<pre><code>&quot;vetur.validation.template&quot;: false,
&quot;vetur.validation.script&quot;: false,
&quot;vetur.validation.style&quot;: false,
</code></pre>

entityMap|0|type|LINK|mutability|MUTABLE|data|url|https://github.com/vuejs/eslint-plugin-vue/issues/1297#issuecomment-755202013|blocks|key|4j4ji|text|检查|unstyled|depth|inlineStyleRanges|entityRanges|65ubg|+vscode->+plugins->+close+Vetur+|code-block|syntax|javascript|8ahbe|重新启动vscode，然后打开Vetur。|7e8g8|有关更多信息，请查看下面的链接：https://github.com/vuejs/eslint-plugin-vue/issues/1297#issuecomment-755202013|offset|length|eqil0^0|0|0|0|G|25|0|0^^$0|$1|$2|3|4|5|6|$7|8]]]|9|@$A|B|C|D|2|E|F|U|G|@]|H|@]|6|$]]|$A|I|C|J|2|K|F|V|G|@]|H|@]|6|$L|M]]|$A|N|C|O|2|E|F|W|G|@]|H|@]|6|$]]|$A|P|C|Q|2|E|F|X|G|@]|H|@$R|Y|S|Z|A|10]]|6|$]]|$A|T|C|-4|2|E|F|11|G|@]|H|@]|6|$]]]]

Check
<pre><code> vscode-&gt; plugins-&gt; close Vetur 
</code></pre>
and restart vscode, then open Vetur.
For more informations, check linke below:
<a href="https://github.com/vuejs/eslint-plugin-vue/issues/1297#issuecomment-755202013" rel="nofollow noreferrer">https://github.com/vuejs/eslint-plugin-vue/issues/1297#issuecomment-755202013</a>

entityMap|0|type|LINK|mutability|MUTABLE|data|url|https://vuejs.github.io/vetur/guide/setup.html#advanced|1|IMAGE|IMMUTABLE|imageUrl|https://i.stack.imgur.com/U4RVg.png|imageAlt|blocks|key|ei944|text|如果您正在处理package.json，并且package.json不在工作空间根目录中，那么默认情况下，Vetur将无法找到monorepo，因此它无法确定vue版本。|unstyled|depth|inlineStyleRanges|entityRanges|8dhd8|在这种情况下，我们需要告诉Vetur+package.json的位置|9abta|offset|length|5jsvl|​|1tdf6|?|atomic|37tl1|8bl0a^0|0|0|0|1J|0|0|0|0|1|1|0|0^^$0|$1|$2|3|4|5|6|$7|8]]|9|$2|A|4|B|6|$C|D|E|-4]]]|F|@$G|H|I|J|2|K|L|10|M|@]|N|@]|6|$]]|$G|O|I|P|2|K|L|11|M|@]|N|@]|6|$]]|$G|Q|I|8|2|K|L|12|M|@]|N|@$R|13|S|14|G|15]]|6|$]]|$G|T|I|U|2|K|L|16|M|@]|N|@]|6|$]]|$G|V|I|W|2|X|L|17|M|@]|N|@$R|18|S|19|G|1A]]|6|$]]|$G|Y|I|U|2|K|L|1B|M|@]|N|@]|6|$]]|$G|Z|I|-4|2|K|L|1C|M|@]|N|@]|6|$]]]]

If you are working on a monorepo and thus the package.json is not at the workspace root, then Vetur by default won't able to find package.json, thus it couldn't figure out the vue version.
In that case, we need to tell Vetur the package.json location
<a href="https://vuejs.github.io/vetur/guide/setup.html#advanced" rel="noreferrer">https://vuejs.github.io/vetur/guide/setup.html#advanced</a>
<a href="https://i.stack.imgur.com/U4RVg.png" rel="noreferrer"><img src="https://i.stack.imgur.com/U4RVg.png" alt="enter image description here" /></a>

entityMap|blocks|key|drhku|text|在.eslintrc.js中|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2ehpq|规则：{+"vue/valid-template-root"："off“}|32ntk^0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|F|9|@]|A|@]|B|$]]|$2|C|4|D|6|7|8|G|9|@]|A|@]|B|$]]|$2|E|4|-4|6|7|8|H|9|@]|A|@]|B|$]]]]

in .eslintrc.js
rules: {
&quot;vue/valid-template-root&quot;: &quot;off&quot;
}

entityMap|blocks|key|98hv9|text|这里用到了这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|gatt|在.eslintrc.js中|cnknf|而不是：|dau7n|rules:+{+"vue/no-multiple-template-root":+0+}|code-block|syntax|javascript|aohvd|尝试：|c0f79|rules:+{"vue/no-multiple-template-root":+"off"+}|fndue^0|0|0|0|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|Q|9|@]|A|@]|B|$]]|$2|C|4|D|6|7|8|R|9|@]|A|@]|B|$]]|$2|E|4|F|6|7|8|S|9|@]|A|@]|B|$]]|$2|G|4|H|6|I|8|T|9|@]|A|@]|B|$J|K]]|$2|L|4|M|6|7|8|U|9|@]|A|@]|B|$]]|$2|N|4|O|6|I|8|V|9|@]|A|@]|B|$J|K]]|$2|P|4|-4|6|7|8|W|9|@]|A|@]|B|$]]]]

Here worked with this:
in .eslintrc.js
instead of:
<pre><code>rules: { &quot;vue/no-multiple-template-root&quot;: 0 }
</code></pre>
try:
<pre><code>rules: {&quot;vue/no-multiple-template-root&quot;: &quot;off&quot; }
</code></pre>

entityMap|blocks|key|5emg8|text|使用Vue3上的vue+create+project，将以下内容添加到您的package.json文件中：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|bh0l2|"eslintConfig":+{
++++"root":+true,
++++"env":+{
++++++"node":+true
++++},
++++"extends":+[
++++++"plugin:vue/essential",
++++++"eslint:recommended"
++++],
++++"parserOptions":+{
++++++"parser":+"babel-eslint"
++++},
++++"rules":+{
++++++"vue/no-multiple-template-root":+"off"
++++}
++}|code-block|syntax|javascript|6egjf|添加“规则”可以消除问题中描述的错误。无需更改默认vetur设置。|70ra4^0|8|I|11|C|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|O|9|@$A|P|B|Q|C|D]|$A|R|B|S|C|D]]|E|@]|F|$]]|$2|G|4|H|6|I|8|T|9|@]|E|@]|F|$J|K]]|$2|L|4|M|6|7|8|U|9|@]|E|@]|F|$]]|$2|N|4|-4|6|7|8|V|9|@]|E|@]|F|$]]]]

With <code>vue create project</code> on Vue3, add this to your <code>package.json</code> file:
<pre><code>&quot;eslintConfig&quot;: {
 &quot;root&quot;: true,
 &quot;env&quot;: {
 &quot;node&quot;: true
 },
 &quot;extends&quot;: [
 &quot;plugin:vue/essential&quot;,
 &quot;eslint:recommended&quot;
 ],
 &quot;parserOptions&quot;: {
 &quot;parser&quot;: &quot;babel-eslint&quot;
 },
 &quot;rules&quot;: {
 &quot;vue/no-multiple-template-root&quot;: &quot;off&quot;
 }
 }
</code></pre>
Adding the &quot;rules&quot; eliminates the error as described in the question. No need to change the default vetur settings.

entityMap|blocks|key|bpvob|text|这个错误发生在我身上，因为我没有在VS中打开项目根目录，而是打开了父文件夹，因此Vetur在这个文件夹中查找package.json。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|a8p7t^0|1I|C|0^^$0|$]|1|@$2|3|4|5|6|7|8|H|9|@$A|I|B|J|C|D]]|E|@]|F|$]]|$2|G|4|-4|6|7|8|K|9|@]|E|@]|F|$]]]]

The error occurred with me, because I had not opened the project root in VS Code, but the parent folder, and Vetur thus looked in this for the <code>package.json</code>.

entityMap|blocks|key|ad81c|text|Penny+Liu和skalta为Vue-cli创建的Vue+3项目提供了真正的答案。问题是package.json必须在直接路径中，而不是在子文件夹中。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|34n3|由于下面指定的Vue3扩展了vscode，vscode/vetur将读取配置，错误将消失。添加"vue/no-multiple-template-root":+"off"不会有任何帮助，因为package.json甚至不能被林特读取。|offset|length|style|CODE|8soe9|++"eslintConfig":+{
++++"root":+true,
++++"env":+{
++++++"node":+true
++++},
++++"extends":+[
++++++"plugin:vue/vue3-essential",
++++++"@vue/standard"
++++],
++++"parserOptions":+{
++++++"parser":+"babel-eslint"
++++},
++++"rules":+{}
++},|code-block|syntax|javascript|e3mrt^0|0|1B|12|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|O|9|@]|A|@]|B|$]]|$2|C|4|D|6|7|8|P|9|@$E|Q|F|R|G|H]]|A|@]|B|$]]|$2|I|4|J|6|K|8|S|9|@]|A|@]|B|$L|M]]|$2|N|4|-4|6|7|8|T|9|@]|A|@]|B|$]]]]

Penny Liu and skalta has the real answer for Vue 3 projects created by the Vue-cli. Problem is the package.json has to be in the immediate path, not in the child folders.
As the package.json specified the Vue3 extends below, vscode/vetur will read the configs and the error will go away. Adding <code>&quot;vue/no-multiple-template-root&quot;: &quot;off&quot;</code> won't help as the package.json is not even read by the linter.
<pre><code> &quot;eslintConfig&quot;: {
 &quot;root&quot;: true,
 &quot;env&quot;: {
 &quot;node&quot;: true
 },
 &quot;extends&quot;: [
 &quot;plugin:vue/vue3-essential&quot;,
 &quot;@vue/standard&quot;
 ],
 &quot;parserOptions&quot;: {
 &quot;parser&quot;: &quot;babel-eslint&quot;
 },
 &quot;rules&quot;: {}
 },
</code></pre>

After scaffolding a Vue 3 project I noticed an error in my App.vue.
<pre><code>A functional component that renders the matched component for the given path. Components rendered in can also contain its own , which will render components for nested paths.

API Reference

[vue/no-multiple-template-root]
The template root requires exactly one element.eslint-plugin-vue
</code></pre>
I tried putting
<pre><code>&quot;vue/no-multiple-template-root&quot;: 0
</code></pre>
in my .eslintrc.js
But the error remains. How can I get rid of the error? Since in Vue 3 you don't have to have exactly one element in a template.
<pre><code>module.exports = {
 root: true,
 env: {
 node: true
 },
 extends: [
 &quot;plugin:vue/vue3-essential&quot;,
 &quot;eslint:recommended&quot;,
 &quot;@vue/typescript/recommended&quot;,
 &quot;@vue/prettier&quot;,
 &quot;@vue/prettier/@typescript-eslint&quot;
 ],
 parserOptions: {
 ecmaVersion: 2020
 },
 rules: {
 &quot;no-console&quot;: process.env.NODE_ENV === &quot;production&quot; ? &quot;warn&quot; : &quot;off&quot;,
 &quot;no-debugger&quot;: process.env.NODE_ENV === &quot;production&quot; ? &quot;warn&quot; : &quot;off&quot;,
 &quot;vue/no-multiple-template-root&quot;: 0
 }
};
</code></pre>

Vue 3 The template root requires exactly one element. eslint-plugin-vue

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

 在搭建了一个Vue 3项目后，我注意到我的App.vue中出现了一个错误。 A functional component that renders the matched component for the given path. Components rendered in can also contain its...

问Vue 3模板根只需要一个元素。eslint-plugin-vue
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Vue 3模板根只需要一个元素。eslint-plugin-vueEN