使用Vite的嵌套目录Nuxt 3

Question

我想在 nuxt 3 beta 中使用 vite 的嵌套目录。

在 Nuxt 2 中，我在 (nuxt.config.js) 中使用了这个配置，它可以工作：

components: [
{
  path: '~/components', // will get any components nested in let's say /components/test too
  pathPrefix: false,
},],

我有这个目录组织：

| components
 - Header.vue
 - Footer.vue
 | sections
  - HeroSection.vue

但是当我尝试将 <HeroSection/> 放入 pages/index.vue 时出现此错误。

[Vue warn]: Failed to resolve component: HeroSection
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
Invalid value used as weak map key

它在 nuxt 3 中不再工作并且需要进行其他配置吗？因为我在文档中找不到任何相关内容

感谢<3

Answer 1

使用嵌套目录需要将目录名称添加到组件上：

通过这种行为，您可以简化组件命名的复杂性：

- components
    Header.vue
    Footer.vue
  - Sections
      Hero.vue

这样我们就可以像这样使用

在此处的文档中阅读更多内容：https://v3. nuxtjs.org/guide/directory-struct/components#component-names