Skip to main content

​
Installation

npm install @workflow/sveltekit

​
Usage

Import the package in your svelte.config.js to enable workflow functionality:
svelte.config.js
import '@workflow/sveltekit';
import adapter from '@sveltejs/adapter-auto';

export default {
  kit: {
    adapter: adapter(),
  },
};
Then add the Vite plugin:
svelte.config.js
import { workflowPlugin } from '@workflow/sveltekit';
import adapter from '@sveltejs/adapter-auto';

export default {
  kit: {
    adapter: adapter(),
  },
  vite: {
    plugins: [workflowPlugin()],
  },
};

​
API

​
workflowPlugin()

Returns an array of Vite plugins for workflow support in SvelteKit. Takes no arguments. 
import { workflowPlugin } from '@workflow/sveltekit';

​
Configuration Example

svelte.config.js
import '@workflow/sveltekit';
import { workflowPlugin } from '@workflow/sveltekit';
import adapter from '@sveltejs/adapter-vercel';

export default {
  kit: {
    adapter: adapter(),
  },
  vite: {
    plugins: [workflowPlugin()],
  },
};

​
How It Works

​
Top-Level Build

The package executes a top-level build when imported: 
import '@workflow/sveltekit';
This creates workflow entries before the Svelte plugin starts to avoid race conditions in entry discovery.

​
Vite Plugins

workflowPlugin() returns an array of three plugins:
  1. workflowTransformPlugin (from @workflow/rollup): Transforms workflow directives
  2. workflow:sveltekit: Named marker plugin
  3. workflowHotUpdatePlugin (from @workflow/vite): Enables HMR for workflow files

​
Vercel Adapter Support

When using @sveltejs/adapter-vercel, the integration:
  1. Detects Vercel deployment via VERCEL_DEPLOYMENT_ID
  2. Patches .vc-config.json files for workflow functions
  3. Configures experimental triggers for queue-based execution

​
Queue Configuration

For /.well-known/workflow/v1/flow.func: 
{
  "experimentalTriggers": [
    {
      "type": "queue/v2beta",
      "topic": "__wkf_workflow_*",
      "consumer": "default",
      "maxDeliveries": 64,
      "retryAfterSeconds": 5,
      "initialDelaySeconds": 0
    }
  ]
}
For /.well-known/workflow/v1/step.func: 
{
  "experimentalTriggers": [
    {
      "type": "queue/v2beta",
      "topic": "__wkf_step_*",
      "consumer": "default",
      "maxDeliveries": 64,
      "retryAfterSeconds": 5,
      "initialDelaySeconds": 0
    }
  ]
}

​
Build Process

  1. Import-Time: Runs SvelteKitBuilder.build() to create workflow entries
  2. Development: Watches for changes and rebuilds via HMR
  3. Vercel Build: On beforeExit, patches Vercel function configs with queue triggers

​
Builder

Uses SvelteKitBuilder internally, which:
  • Discovers workflows in your SvelteKit project
  • Generates route handlers
  • Creates workflow bundles
  • Integrates with SvelteKit’s routing system

​
Build Queue

Uses createBuildQueue() from @workflow/builders to prevent concurrent builds during development.

​
Generated Routes

The integration creates SvelteKit routes at:
  • /.well-known/workflow/v1/flow - Workflow execution
  • /.well-known/workflow/v1/step - Step execution
  • /.well-known/workflow/v1/webhook/:token - Webhook handler

​
Vercel Function Patching

The beforeExit hook:
  1. Checks for VERCEL_DEPLOYMENT_ID
  2. Un-symlinks workflow function directories
  3. Copies function files from shared location
  4. Patches .vc-config.json with queue triggers
This ensures workflow functions have proper queue-based execution configuration on Vercel.

Build docs developers (and LLMs) love

Get started for freeTalk to us