使用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