Importing Vue Components with Webpack

You can register it globally like you showed, or if you want to register it locally for use in a single component you need to add it to the components object of the Vue instance:

<template>
  <top-bar></top-bar>
  <div class="message">{{ message }}</div>
</template>

<script>
import TopBar from './top-bar.vue'

export default {
  components: {
    TopBar
  },
  data () {
    return {
      message: 'Hello World'
    }
  }
}
</script>