In my current project, I am incorporating a custom component tag using Vue.JS.
Although we have successfully utilized Vue.JS in past projects, the same approach isn't working this time. It seems like I must have overlooked something...
After inspecting the browser console, I encountered this error: console error image
The snippet below is extracted from my app.js
import Vue from 'vue';
import Insights from './components/insight-list.vue';
Vue.config.productionTip = false;
new Vue({
el: '#roots',
components: {
Insights
}
});
Additionally, here's a segment from my Vue component (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>
Therefore, my question remains - what mistake did I make or what step am I missing?