Nuxt DevTools Integration

The @powersync/nuxt module includes a PowerSync diagnostics panel that integrates with Nuxt DevTools. It lets you inspect your app’s sync state, local SQLite data, and configuration while running in development.

Enabling Diagnostics

Add powersync: { useDiagnostics: true } to your nuxt.config.ts:

nuxt.config.ts

export default defineNuxtConfig({
  modules: ['@powersync/nuxt'],
  powersync: {
    useDiagnostics: true
  },
  vite: {
    optimizeDeps: {
      exclude: ['@powersync/web']
    },
    worker: {
      format: 'es'
    }
  }
});

No changes to your plugin code are needed. When useDiagnostics: true is set, NuxtPowerSyncDatabase automatically extends your schema with the diagnostics schema, sets up diagnostics recording and logging, and stores the connector internally so the inspector can access it.

Accessing the Inspector

PowerSync Inspector in Nuxt DevTools — The PowerSync diagnostics panel inside Nuxt DevTools.

Open the inspector in one of two ways:

Nuxt DevTools: open DevTools in your browser and navigate to the PowerSync tab.
Direct URL: navigate to http://localhost:3000/__powersync-inspector.

Inspector Views

View	Description
Sync Status	Real-time connection status, sync progress, upload queue statistics, and error monitoring
Data Inspector	Browse and search your local SQLite tables
Bucket Inspector	Browse your buckets and their data
Config Inspector	View your PowerSync configuration, connection options, and schema
Logs	Real-time log output with syntax highlighting and search

Known Issues

The inspector uses unocss as a transitive dependency, which can conflict with Tailwind CSS. If you use Tailwind, add the following to your nuxt.config.ts:

nuxt.config.ts

export default defineNuxtConfig({
  unocss: {
    autoImport: false
  }
});

Dart & Flutter DevTools Extension

Usage & Billing

Get Started

Configuration Details

Sync Streams & Rules

Client SDKs

Handling Writes

Maintenance & Ops

Integrations

Tools

Resources

Nuxt DevTools Integration

Enabling Diagnostics

Accessing the Inspector

Inspector Views

Known Issues

​Enabling Diagnostics

​Accessing the Inspector

​Inspector Views

​Known Issues

Enabling Diagnostics

Accessing the Inspector

Inspector Views

Known Issues