Vue.js - Vuetify：不明なカスタム要素：[...] - コンポーネントを正しく登録しましたか？

Question

Vuetifyの各HTMLタグでこのエラーが発生しています。

const Vue = require("vue"); 
const Vuetify = require("vuetify"); 
const tracksList = require("./track-list.vue"); 

Vue.use(Vuetify); 

trackList = new Vue({el: "#track-list", template: "<tracksList/>", components: {tracksList}}); 

ファイルトラック-list.vueは次のとおりです：私のテンプレートのトラックリスト - で

<template src="../templates/track-list-component.html"></template> 
<script src="./track-list.js"></script> 

は私が私が持っている私のmain.jsで

npm install --save-dev vuetify 

を使用してVuetifyをインストールcomponent.html、Vuetifyを使用する部分は次のとおりです。

<div class="track-name-row" 
       v-on:click="expandTrack(project.structure.tracks.indexOf(track))" 
       @contextmenu="show"> 
       <li class="track-color-viewer"></li> 
       <span>{{"Track "+project.structure.tracks.indexOf(track)}}</span> 
       <img class="item-view" src="../assets/img/ic_view.svg" alt="view"> 
      </div> 

      <v-menu offset-y v-model="showMenu" :position-absolutely="true" :position-x="x" :position-y="y"> 
       <v-list> 
        <v-list-tile> 
         <v-list-tile-title>test</v-list-tile-title> 
        </v-list-tile> 
       </v-list> 
      </v-menu> 

NPMとVuetifyをインストールし、main.jsにVue.use（Vuetify）を使用するよりも行うには他のものがあり、

module.exports = { 
    name: "track-list", 
    components: { 
      [ ... ] 
    }, 

    data() { 
     return { 
       [ ... ] 
     }; 
    } 
} 

Vuetifyをインポートする：

トラックlist.jsは、単純なVueのコンポーネントのですか？私は少し失われて悲しいです、このlibは本当に素晴らしいようです。

Answer 1

module.exports = { 
    name: "track-list", 
    components: { 
     [ ... ] 
    }, 
    data() { 
     return { 
      [ ... ] 
     }; 
    } 
} 

は

module.exports = { 
    name: "track-list", 
    components: { 
     componentName 
    }, 
    data() { 
     return { 
      variableName: '' 
     }; 
    } 
} 

コンポーネントは、使用しているすべてのカスタムコンポーネントを含める必要があります。（例ではコンポーネント名）である必要があります。

データには、そのコンポーネントに使用しているすべての変数（例ではvariableName）が含まれている必要があります。