Nuxt specific information

Nested components directories

By default, Nuxt expects components in the /components directory (at app root). We can use subdirectories in there, but then the subdirectory becomes part of the component names, but only if it is not already: https://nuxtjs.org/docs/directory-structure/components/#nested-directories

example:

.
├── mycomponent1.vue
└── nav
    ├── mycomponent2.vue
    └── nav-mycomponent3.vue

Then we would use these as:

• <mycomponent1></mycomponent1> and
• <nav-mycomponent2></nav-mycomponent2>, but also:
• <nav-mycomponent3></nav-mycomponent3> because if the subdir is already part of the component name, it is not added twice.

We could also use the components without their subdir name if we register them globally in nuxt.config.js:

components: {
  dirs: [
    '~/components',
    '~/components/nav'
  ]
}