Installation
Quick Start
You can start a fresh new project with:
pnpm add @fixers/nuxt-lucia-auth
Add @fixers/nuxt-lucia-auth as a module in your nuxt.config file:
export default defineNuxtConfig({
modules: [
'@fixers/nuxt-lucia-auth'
]
})
And that's it! You can now use the auth module in your Nuxt app.
By default, the module comes with a global middleware that will redirect users to the login page if they are not authenticated.
The login page is /login by default, but you can change it in the auth.pages configuration.
The module also come with built in helpers to login with Google and GitHub or even email and password.
Environment variables
Environment variables for OAuth providers are prefixed with NUXT_OAUTH_.
To add the Google OAuth keys, you can add the following to your .env file:
NUXT_OAUTH_GOOGLE_CLIENT_ID=""
NUXT_OAUTH_GOOGLE_CLIENT_SECRET=""
You can find your Google OAuth keys in the Google Cloud Console.
For other OAuth providers, you can add the keys in the same way:
NUXT_OAUTH_GITHUB_CLIENT_ID=""
NUXT_OAUTH_GITHUB_CLIENT_SECRET=""
Note, you are not required to use this configuration, in the advanced usage section we'll cover how to setup pretty much everything manually.
Configuration
You can configure the module in your nuxt.config file:
export default defineNuxtConfig({
auth: {
pages: {
login: '/login',
},
middleware: {
enabled: true,
global: true,
allow404WithoutAuth: false,
},
},
})
The configuration is quite simple.
The pages object allows you to configure the login page.
This is the page your user will be redirected to by default if they are not authenticated. You are free to skip this setting if you are not using the built in middleware.
The middleware object allows you to configure the middleware.
The global option will install the auth middleware globally thus protecting all your routes.
You need to manually disable the middleware for routes you want to be public.
<script setup>
definePageMeta({
auth: false
})
</script>
To fully turn off the middleware, set enabled to false.