Creating a child component within a parent component in Vue.JS
You registered the Child
component locally in the main instance, so it is not available in App.vue
Remove it form the main instance and add it to App.vue:
App.vue
<template> <div> <h1>{{ parent_msg }}</h1> <child></child> </div></template><script>import Child from './child.vue'export default { data () { return { parent_msg: 'Hello From the Parent!' } }, components: {child: Child}}</script>
..or register it globally with Vue.component('child', Child)
in your main.js file. Then it's available everywhere.