Vite Plugin

The @loewen-digital/fullstack Vite plugin adds development tooling to your build: the Dev UI panel, virtual module support, and hot-reload awareness for configuration changes.

Import

import { fullstack } from '@loewen-digital/fullstack/vite'

Setup

Add the plugin to your vite.config.ts:

import { defineConfig } from 'vite'
import { sveltekit } from '@sveltejs/kit/vite'
import { fullstack } from '@loewen-digital/fullstack/vite'

export default defineConfig({
  plugins: [
    sveltekit(),
    fullstack({
      // Enable the Dev UI at /_fullstack
      devUI: true,
    }),
  ],
})

Features

Dev UI

When devUI: true, the plugin mounts a development panel at /_fullstack (in dev mode only). The Dev UI provides:

• Mail preview — view all emails sent via the console driver in a browser
• Queue inspector — view pending, processing, and failed jobs
• Cache explorer — inspect cache keys and values
• Session viewer — debug session contents for the current user
• Log viewer — tail structured logs in real time

The Dev UI is never included in production builds.

Configuration hot-reload

When your fullstack.config.ts changes, the plugin triggers a module reload without requiring a full server restart.

Type generation

The plugin can generate TypeScript types from your database schema and route configuration:

fullstack({
  devUI: true,
  generateTypes: true, // writes to src/fullstack.d.ts
})

Config options

Option	Type	Default	Description
devUI	boolean	false	Enable the Dev UI panel in development
devUI.path	string	'/_fullstack'	URL path for the Dev UI
generateTypes	boolean	false	Auto-generate TypeScript types from schema
configFile	string	'fullstack.config'	Path to the stack config file