Vue 2にコンポーネントを追加する方法

Question

私はvue-cliでVue 2.5.2アプリケーションを作成しました。

私はこれは私がエラーメッセージである私の第一の成分（<jsontree />）独自に動作しますが、私は別のコンポーネントで使用するために登録する方法を見つけ出すことはできません（<HelloWorld>）

を作成してみました：

[Vue warn]: Unknown custom element: <jsontree> - did you register the component correctly? For recursi§ve components, make sure to provide the "name" option. 

found in 

---> <HelloWorld> at src/components/HelloWorld.vue 
     <App> at src/App.vue 
     <Root> 

これはHelloWorldのテンプレートです：

<template> 
    <div> 
    <jsontree /> 
    </div> 
</template> 

私は "直接"、それに移動したときに、それは動作しますが、THI sは私のルートファイルです。

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 
    } 
    ] 
}) 

Answer 1

<script>の部分がありません。

また、テンプレート内にkebab-caseと記述することは必須ではありませんが、慣習的です。

Vueのエンジンがあなたのscript

内camelCaseとしてそれをインポートしても、テンプレート内kebab-caseと書き込みを行えるようにする責任があるコードを参照してください。

HelloWorld.vue

<template> 
    <div> 
    <json-tree /> 
    </div> 
</template> 

<script> 
import jsonTree from './jsonTree.vue' // or wheatever location this component is residing. 
export default { 
    components: {jsonTree} 
} 
</script>