在 Vue
项目编译时,出现如下报错
[unplugin-vue-components] component "xxx"(xxx/Index.vue) has naming conflicts with other components, ignored.
[unplugin-vue-components] component "xxx"(xxx/Index.vue) has naming conflicts with other components, ignored.
[unplugin-vue-components] component "xxx"(xxx/Index.vue) has naming conflicts with other components, ignored.
[unplugin-vue-components] component "xxx"(xxx/Index.vue) has naming conflicts with other components, ignored.
因为本人的个人习惯,在写组件时,通常都是以 Index.vue
进行命名,造成项目拥有大量的同名文件而出现上述报错。
解决方案
为 unplugin-vue-components
插件配置 directoryAsNamespace
属性为 true
即可。
// vite.config.ts
plugins: [
vue(),
Components({
// ... 其它配置
// 允许子目录作为组件的命名空间前缀
directoryAsNamespace: true
})
]