I recently developed a Vue 2.5.2 application using vue-cli.
While attempting to create my first component (<jsontree />
), I encountered an issue as it functions independently, but I am struggling to understand how to properly register it for use in another component (<HelloWorld>
).
The error message displayed is:
[Vue warn]: Unknown custom element: <jsontree> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <HelloWorld> at src/components/HelloWorld.vue
<App> at src/App.vue
<Root>
This is the template for HelloWorld
:
<template>
<div>
<jsontree />
</div>
</template>
It works when accessed directly. Here is my routes file:
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import JsonTree from '@/components/jsonTree'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'Hello',
component: HelloWorld
},
{
path: '/tree',
name: 'Tree',
component: JsonTree
}
]
})