Guide

Introduction

What Nuxt PGlite is and the pieces it is made of.

Nuxt PGlite wires PGlite, Postgres compiled to WebAssembly, into Nuxt. It comes in independent pieces you combine as you like:

  • Server instance: usePGlite() in your Nitro routes, a PGlite created on first use and configured in server/pglite.config.ts.
  • Development socket: that database served over the Postgres wire protocol while nuxt dev runs, so pg, postgres.js, Drizzle, drizzle-kit or psql reach it through DATABASE_URL.
  • Client instance: an in-browser PGlite in a Web Worker shared between tabs, with live-query composables. Off by default.
  • DevTools: a PGlite tab in Nuxt DevTools to inspect each instance, run SQL and trigger your own actions.
  • Migrations: nuxt-pglite/migrations applies a folder of SQL migration files to the local database from init, the same files production is built from.
  • Testing: nuxt-pglite/testing builds a database from your server config for the test suite, in memory and forkable per test, with a vitest globalSetup and a recipe for @nuxt/test-utils.

Each piece is only in your bundle when it is enabled. @electric-sql/pglite is a peer dependency: you pick its version and import its extensions yourself, and the types follow your config.

Installation

Add the module and PGlite to your project.

Quick start

A server route and a component, each with its own database.

PGlite in dev, Postgres in prod

The headline recipe: no database to install locally, any Postgres in production.

Reference

Every option, export, hook and environment variable.