Estoy usando Vue.JS en un proyecto en el que intento cargar una etiqueta de componente personalizada.
Hemos usado Vue.JS en otros proyectos antes, así que básicamente lo copié y lo pegué en un nuevo proyecto, aunque no funciona, así que asumo que me perdí algo...
La consola de mi navegador devuelve este error: imagen de error de la consola
El siguiente código es de mi app.js
import Vue from 'vue'; import Insights from './components/insight-list.vue'; Vue.config.productionTip = false; new Vue({ el: '#roots', components: { Insights } });Y este código es de mi componente vue ( insight-list.vue )
<template> <div class="insight-list"> <h1>Hello world</h1> </div> </template> <script> export default { name: 'insight-list', props: [ ], computed: { }, methods: { }, components: { } } </script>Así que aquí queda mi pregunta, ¿qué hice mal / qué no hice todavía?
creo que deberías intentarlo
new Vue({ el: '#roots', components: { 'insight-list': Insights } });fuente: https://vuejs.org/v2/guide/components-registration.html
"Para cada propiedad en el objeto de componentes, la clave será el nombre del elemento personalizado, mientras que el valor contendrá el objeto de opciones para el componente".