Importación de componentes Vue con Webpack
Tengo una configuración de la aplicación Hello World Vue con Webpack y tengo el componente de la aplicación inicial funcionando y montado en el cuerpo. Aunque dentro de ese componente de la aplicación no puedo entender cómo usar más componentes que hice.
main.js
import Vue from 'vue'
import App from './app.vue'
new Vue({
el: 'body',
components: { App }
})
app.vue
<template>
<div class="message">{{ message }}</div>
</template>
<script>
export default {
data () {
return {
message: 'Hello World'
}
}
}
</script>
Yo he tratado
import TopBar from './top-bar.vue'
En main.js y en la sección de script de app.vue, intenté usar
<top-bar></top-bar>
sin suerte
Creo que me falta cómo registrar el componente correctamente, como en los documentos de Vue que hace:
Vue.component('top-bar', TopBar);
Pero creo que cuando uso webpack con vue-loader necesito hacer algo diferente.