Estrutura de um Componente Vue

Cada componente deve consistir em duas tags obrigatórias:

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

Na tag template deve ser escrita a marcação, ou seja, a visualização do nosso componente:

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

E na tag script deve ser escrito o código JavaScript do nosso componente. Este código deve ser um objeto que será exportado do nosso arquivo de componente:

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

No objeto exportado são especificadas várias configurações e funções do componente. Uma das configurações é o nome deste componente:

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