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