A Nuxt module that provides seamless integration with PocketBase, offering composables for authentication, real-time data, and simplified API interactions.
- 🔥 Full TypeScript Support
- 🔒 Authentication Utilities
- Email/Password authentication
- OAuth providers support
- Auto-refresh tokens
- Persistent auth state
- 🎯 Simple Setup - Just install and configure
- ⚡️ Composables - Intuitive composables for PocketBase operations
- 🛠 Dev Tools Integration - Access PocketBase Admin directly from Nuxt DevTools
- 📦 Zero Configuration - Works out of the box with sensible defaults
- Install the module:
# npm
npm install pocketbase-nuxt
# yarn
yarn add pocketbase-nuxt
# pnpm
pnpm add pocketbase-nuxt
- Add the module to your
nuxt.config.ts
:
export default defineNuxtConfig({
modules: ['pocketbase-nuxt'],
pocketbase: {
url: 'http://127.0.0.1:8090' // Your PocketBase URL
}
})
<script setup lang="ts">
const { user, login, signup, signOut } = usePocketbaseAuth()
// Login
await login({
email: '[email protected]',
password: 'password123'
})
// Sign up
await signup({
email: '[email protected]',
password: 'password123',
passwordConfirm: 'password123',
name: 'New User'
})
// OAuth Authentication
await handleOAuth('google', {
redirectPath: '/dashboard',
onSuccess: () => {
// Handle successful authentication
}
})
</script>
<template>
<div>
<div v-if="user">
Welcome, {{ user.name }}!
<button @click="signOut">Sign Out</button>
</div>
</div>
</template>
<script setup lang="ts">
const { pb } = usePocketbase()
// Use any PocketBase client method
const records = await pb.collection('posts').getList(1, 20)
</script>
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch