公開日:11/20/2020 更新日:3/26/2022
コンポ―ネントテンプレートを作成した際に下記のエラー発生。
該当のエラー
Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.
翻訳
コンポーネントエレメントには、ルートエレメントを1つだけ含める必要があります。もし、複数のエレメントで v-if ディレクティブを使用しているなら、代わりにv-else-if を使用して まとめて下さい。
原因はエラーコードの指摘のままでした。
./componets/sidevar.vue
<template>
<h1>おすすめ記事</h1>
<nuxt-link :to="'blog/d6_mxl1zs'">
<h2>Nuxt.js , microCMS ,Netlify の組み合わせでJAMstackなブログ開発</h2>
</nuxt-link>
</template>
div タグの入れ忘れですね。。orz
div タグ を外側に追加して解決!
<template>
<div>
<h1>おすすめ記事</h1>
<nuxt-link :to="'blog/d6_mxl1zs'">
<h2>Nuxt.js , microCMS ,Netlify の組み合わせでJAMstackなブログ開発</h2>
</nuxt-link>
</div>
</template>
久々にnuxt.js を触ったので基本的なルールを失念しておりました。精進します。。