Menggunakan Vite's Nested Directory Nuxt 3

Question

Saya mahu menggunakan direktori bersarang vite dalam nuxt 3 beta.

Dalam Nuxt 2 saya menggunakan konfigurasi ini dalam (nuxt.config.js) dan ia berfungsi:

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

Saya mempunyai organisasi direktori ini:

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

Tetapi apabila saya cuba menambah <HeroSection/> 放入 pages/index.vue Saya mendapat ralat ini.

[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

Adakah ia tidak lagi berfungsi dalam nuxt 3 dan memerlukan konfigurasi tambahan? Kerana saya tidak dapat mencari apa-apa yang berkaitan dalam dokumentasi

Terima kasih<3

Answer 1

Menggunakan direktori bersarang memerlukan penambahan nama direktori pada komponen:

Dengan tingkah laku ini, anda boleh memudahkan kerumitan penamaan komponen:

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

Jadi kita boleh guna macam ni

Baca lebih lanjut dalam dokumentasi di sini: https://v3.nuxtjs.org/guide/directory-struct/components#component-names