nuxt: definePageMeta doesnt apply the correct layout

Environment

RootDir: /sandbox                                                                    06:59:32
Nuxt project info:                                                                   06:59:32

------------------------------
- Operating System: `Linux`
- Node Version:     `v14.18.1`
- Nuxt Version:     `3.0.0-27406801.569aaeb`
- Package Manager:  `yarn@1.22.17`
- Bundler:          `Vite`
- User Config:      `-`
- Runtime Modules:  `-`
- Build Modules:    `-`
------------------------------

Reproduction

https://codesandbox.io/s/silent-brook-m9q8l?file=/pages/test.vue

Describe the bug

With the recent breaking change, discussed here, https://github.com/nuxt/framework/discussions/2883 . Only the default layout seems to be getting applied. Notice the test page, it should use the custom layout, but doesnt do so and ends up using the default layout.

Additional context

No response

Logs

No response

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 1
Comments: 15 (11 by maintainers)

Most upvoted comments

I think for the developers who are already using nuxt3 to report issues, a short hint with a link to the BC discussion inside the docs would be helpful.

Probably here: v3.nuxtjs.org/getting-started/introduction

and even in the issue template somewhere

Blakeinstein on Feb 14, 2022

PRs would be welcome.

Will gladly take this up.

Blakeinstein on Feb 14, 2022

Can you still reproduce this locally if you upgrade your nuxt instance with npx nuxi upgrade @Blakeinstein?

Yup can confirm that somewhere down the line the issue fixed itself. Sorry I was away for the weekend.

As for the rest of the comments, I did wrap the nuxtpage in the layout, and was able to get a reproduction during our conversation on discord. Could be a weird version resolution issue that seems to have cleared out over reinstalls.

And for anyone stumbling on this issue,

TL;DR for the entire issue you might also want to check two things in your app.vue

<template>
    <NuxtLayout>
    	<NuxtPage />
    </NuxtLayout>
</template>

and dont forget to have your definePageMeta in a <script setup> if you are not exporting anything from your script.

<script setup>
    definePageMeta({
        layout: 'custom'
    })
</script>

Blakeinstein on Feb 14, 2022

Just to be clear, that is the current desired behaviour. Make sure to check https://github.com/nuxt/framework/discussions/2883 when upgrading beta versions of Nuxt.

danielroe on Feb 14, 2022