0100-nuxt-auth

Implement Nuxt authentication and permission checks with Laravel Sanctum.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/MrJmpl3/codex_____data_____configuration --skill 0100-nuxt-auth
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: 0100-nuxt-auth
Source: https://github.com/MrJmpl3/codex_____data_____configuration/tree/main/skills/0100-nuxt-auth
Command: npx skills add https://github.com/MrJmpl3/codex_____data_____configuration --skill 0100-nuxt-auth

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It solves the problem of protecting Nuxt pages and UI actions while implementing consistent login/logout and permission-based authorization using Laravel Sanctum.

Core Features & Use Cases

  • Sanctum auth wiring: Configure Nuxt to authenticate against Laravel Sanctum endpoints and manage redirect behavior for authenticated vs guest users.
  • Auth composable usage: Use the Sanctum composable to initialize the user session, log in, log out, and check authentication state.
  • Permission-based authorization: Render components conditionally and protect routes/pages by enforcing required permissions.
  • Use case: When building an admin area, protect pages like leads listing and only show or enable actions (e.g., create leads) to users who have the correct permissions.

Quick Start

Add the 0100-nuxt-auth Skill to your Nuxt project, configure sanctum endpoints in nuxt.config.ts, then protect a page with definePageMeta({ permissions: "leads.list" }).

Frequently Asked Questions about 0100-nuxt-auth

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I protect Nuxt routes with permission-based authorization using Laravel Sanctum?

Protect Nuxt routes by applying definePageMeta with specific permissions constraints, using Sanctum composables to enforce permission-based authorization and restrict page access for authenticated users.

Can I conditionally render UI components based on user permissions in Nuxt?

Yes, you can conditionally render UI components by applying permission checks to verify user permissions, ensuring only authorized users view or interact with specific UI actions like create buttons.

Does Nuxt authentication work with Laravel Sanctum for login and logout flows?

Nuxt authentication integrates directly with Laravel Sanctum to manage login and logout flows, initialize authenticated user state, and configure endpoint redirects for guest versus authenticated users.

How do I configure Sanctum endpoints for a Nuxt authentication module?

Configure Sanctum endpoints within nuxt.config.ts to establish authentication routes and redirect behavior, enabling the Nuxt Sanctum module to manage user sessions and authentication state effectively.

What is the best way to implement role-based access control in a Nuxt dashboard application?

Implement role-based access control in a Nuxt dashboard by using permission-based authorization checks at both page and component levels, securing routes and UI actions through Sanctum composables.

Why does my Nuxt page fail to load even after the user is authenticated?

Authenticated Nuxt pages may fail to load if required permissions are not met, as permission-based authorization restricts access by validating user permissions defined in page metadata constraints.