🌿 Nuxt.js Intermediate

What is the difference between `definePageMeta` and layout configuration?

Answer

definePageMeta() is a compile-time macro used within page components to set metadata that Nuxt's routing system processes — it's not a regular composable. It accepts layout to specify which layout wraps the page, middleware to define route guards, pageTransition for animations, and keepalive to cache the component instance. Layout can also be configured globally in nuxt.config.ts via app.layoutTransition. The key distinction is that definePageMeta is per-page configuration evaluated at route time, while the layout component itself is a structural wrapper that uses <slot />. You can also change the layout dynamically using setPageLayout('name').