Начал только осваивать Vue.js и сразу столкнулся с проблемой что не получаеться вывести компонент Navbar.vue в конпонент App.vue. Буду признателен за помощь если подскажите как это сделать. В консоли ошибка Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.
js/App.js
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter);
import App from './components/App';
import Navbar from './components/Navbar';
import Home from './components/Home';
import Articles from './components/Articles';
const router = new VueRouter({
mode: 'history',
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/articles',
name: 'articles',
component: Articles,
}
],
});
const app = new Vue({
el: '#app',
components: { App },
router,
});
js/components/App.vue
<template>
<div>
<navbar></navbar>
<div class="container">
<router-view></router-view>
</div>
</div>
</template>
<script>
export default {}
</script>
js/components/Navbar.vue
<template>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-3">
<ul class="navbar-nav">
<li class="nav-item">
<router-link :to="{ name: 'home' }" class="nav-link">Home</router-link>
</li>
<li class="nav-item">
<router-link :to="{ name: 'articles' }" class="nav-link">Articles</router-link>
</li>
</ul>
</nav>
</template>
<script>
export default {}
</script>