Getting Started

Quickstart

Minimal setup you can copy/paste.

1) Install

pnpm add @onmax/nuxt-better-auth better-auth drizzle-orm @nuxthub/core

2) Enable the module + NuxtHub DB

export default defineNuxtConfig({
  modules: ['@nuxthub/core', '@onmax/nuxt-better-auth'],

  hub: { db: { dialect: 'sqlite' } },

  runtimeConfig: {
    betterAuthSecret: process.env.BETTER_AUTH_SECRET,
    public: {
      siteUrl: process.env.NUXT_PUBLIC_SITE_URL || 'http://localhost:3000',
    },
  },

  routeRules: {
    '/app/**': { auth: 'user' },
    '/admin/**': { auth: { role: 'admin' } },
    '/login': { auth: 'guest' },
  },
})

3) Create the required config files

server/auth.config.ts

import { admin } from 'better-auth/plugins'
import { defineServerAuth } from '@onmax/nuxt-better-auth'

export default defineServerAuth(() => ({
  appName: 'My App',
  emailAndPassword: { enabled: true },
  plugins: [admin()],
}))

app/auth.client.ts

import { createAuthClient } from 'better-auth/vue'
import { adminClient } from 'better-auth/client/plugins'

export function createAppAuthClient(baseURL: string) {
  return createAuthClient({
    baseURL,
    plugins: [adminClient()],
  })
}

export type AppAuthClient = ReturnType<typeof createAppAuthClient>

4) Use it in your app

<script setup lang="ts">
const { loggedIn, user } = useUserSession()
</script>

<template>
  <p v-if="loggedIn">
    Hi {{ user?.name }}
  </p>
  <p v-else>
    Not signed in
  </p>
</template>

Next:

  • Learn how the module works: /core-concepts/how-it-works
  • Browse Better Auth plugins/providers: /better-auth