How to load vue component from another file (webpack)?

Question

Vue.js

Hello everyone, today I tried to use Vue components.
I don't understand how to import a component from another file using webpack.
index.js:

import comp from './components/component.vue'

Vue.component('comp', comp);

let app = new Vue({
vuetify,

components: {
    comp
  },

component.vue:

<template>
  <div>{{message}}</div>
</template>
 
<script>
export default {
  data () {
    return {
      message: 'test'
    }
  }
}
</script>

In the markup it displays

What did I misunderstand about the components? Or about webpack?

Upd: I didn't notice that the original question didn't insert what is displayed in the markup instead of the component. Here it is:

<!--function (a, b, c, d) { return createElement(vm, a, b, c, d, true); }-->

Answer 1

try not to register the component in index.js, just import it,
and remove the components: {} property from new Vue, this may turn out