Nuxt.js default layout not being applied

user_5828289 0
Viewed 4039

I'm brand new to using Nuxt.js, and having an issue: When I created my project, the layouts folder wasn't generated automatically as documented. I added it manually, but default.vue is not being applied anywhere. Here is layouts/default.vue:

<template>
  <div>
      <AppHeader/>
      <Nuxt/>
  </div>
</template>

I've tried things such as manually setting default as the layout in pages and manually importing the AppHeader component in default.vue (although this is definitely not the issue as other HTML I put there doesn't get rendered either). Not sure what's going wrong here, scratching my head. Using nuxt 2.15.7. If there's any additional detail needed please let me know what and I'll gladly provide, thanks.

nuxt.js vue.js javascript
3 Answers

Today, I faced the same issue, I just stop the dev command and did "npm run dev" again.

It woked like a charm.

user_100292650

I also faced this issue today, and it took my like 15 minutes to realize...

I just named my folder layout instead of layouts :')

I'm posting it just in case someone else is as distracted as I am

user_133433110

Just define your components folder path in nuxt.config.js

eg:

components: {
    dirs: [
      '~/shared',
      '~/shared/atoms',
      '~/shared/molecules',
      '~/shared/organisams',
    ]
  },
user_146406140
Related