问题描述
在 Vue 项目的控制台中出现以下报错信息:
[Vue warn]: Invalid component name: “404”. Component names should conform to valid custom element name in html5 specification.
翻译:
[Vue warn]:无效的组件名称:“404”。组件名称应符合html5规范中的有效自定义元素名称。
问题出现原因
Vue 组件的命名不符合html5规范
<template>
<div>
404 Not Found
</div>
</template>
<script>
export default {
name: "404" // 此处的 Vue 组件命名不符合 HTML5 规范
}
</script>
解决方案
将 name 修改为 ‘NotFound’,即:
<template>
<div>
404 Not Found
</div>
</template>
<script>
export default {
name: "NotFound" // 此时的命名符合 HTML5 规范
}
</script>
相关知识
- Custom Elements 标准
- 推荐阅读:http://www.ruanyifeng.com/blog/2017/06/custom-elements.html