vue 引入子组件报错问题

错误信息:

    Do not use built-in or reserved HTML elements as component id: header

源码:

<script>
import header from "./components/header"
import aside from "./components/aside"
import footer from "./components/footer"
export default {
  name: 'layout',
  components: {
    header: header,
    aside: aside,
    footer: footer
  }
}
</script>

原因:

    vue里面不允许使用 Html已有的标签作为自定义标签

修改方案:

<script>
import header from "./components/header"
import aside from "./components/aside"
import footer from "./components/footer"
export default {
  name: 'layout',
  components: {
    'v-header': header,
    'v-aside': aside,
    'v-footer': footer
  }
}
</script>

修复结果: ok