首页 > 解决方案 > 无效的组件名称:“pages/product/_slug.vue”。组件名称应符合 html5 规范中的有效自定义元素名称

问题描述

我正在使用 Nuxt.js 并且有一些动态路由。我的文件夹结构是这样的:

- pages
 - product
  - _slug.vue

我链接到这样的路线:

<nuxt-link :to="{ name: 'product-slug', params: { slug: product.slug } }">

它工作正常,它显示了正确的 URL,也可以很好地引导页面,但是,我的控制台中出现了一个恼人的红色错误:

[Vue warn]: Invalid component name: "pages/product/_slug.vue". Component names should conform to valid custom element name in html5 specification.

在此处输入图像描述

我发现了这个问题,但收效甚微:https ://github.com/nuxt/nuxt.js/issues/165

标签: javascriptvue.jsroutingvue-routernuxt.js

解决方案


在组件中有名称的地方,删除名称之间的空格。例如

export default {
  name: 'Assign Role'
}

将其更改为:

export default {
  name: 'AssignRole',
}

推荐阅读