Vueコンポーネントの構造

各コンポーネントは、以下の2つのタグで構成される必要があります：

App.vue<script>
  
</script>
<template>
  
</template>

templateタグ内には、コンポーネントのビュー、 つまりレイアウトを記述します：

App.vue<template>
  <div>
    Hello World
  </div>
</template>

一方、scriptタグ内には、コンポーネントのJavaScriptコードを記述します。 このコードは、コンポーネントファイルからエクスポートされるオブジェクトである必要があります：

App.vue<script>
  export default {
    
  }
</script>

エクスポートされるオブジェクトには、コンポーネントの様々な設定や関数が指定されます。 設定の1つに、このコンポーネントの名前があります：

App.vueexport default {
  name: 'App',
}