Skip to main content
This guide shows you how to install Workflow DevKit in an Astro project.
1

Install dependencies

Install the workflow package:
npm install workflow
2

Configure Astro

Add the Workflow integration to your Astro config:
astro.config.mjs
import { defineConfig } from 'astro/config';
import { workflow } from 'workflow/astro';

export default defineConfig({
  integrations: [workflow()]
});
The integration automatically:
  • Adds Vite plugins for workflow transformation and hot reloading
  • Builds workflow bundles during development
  • Generates Vercel functions during production builds (when deployed to Vercel)
3

Enable TypeScript support (Optional)

Add the Workflow TypeScript plugin to your tsconfig.json for IntelliSense:
tsconfig.json
{
  "compilerOptions": {
    "plugins": [
      {
        "name": "workflow"
      }
    ]
  }
}

​
How it works

The Astro integration:
  • Uses @workflow/rollup for code transformation
  • Uses @workflow/vite for hot module replacement
  • Builds workflow bundles during the astro:config:setup hook
  • Generates Vercel-specific functions during the astro:build:done hook
  • Automatically discovers workflows in your project

​
Example workflow

src/workflows/newsletter.ts
import { sleep } from "workflow";

export async function sendNewsletter(subscriberId: string) {
  "use workflow";

  const subscriber = await getSubscriber(subscriberId);
  await sendEmail(subscriber);
  await sleep("7 days");
  await sendFollowUp(subscriber);

  return { status: "sent" };
}

async function getSubscriber(id: string) {
  "use step";
  return { id, email: `user-${id}@example.com` };
}

async function sendEmail(subscriber: { id: string; email: string }) {
  "use step";
  console.log(`Sending newsletter to ${subscriber.email}`);
}

async function sendFollowUp(subscriber: { id: string; email: string }) {
  "use step";
  console.log(`Sending follow-up to ${subscriber.email}`);
}

​
Triggering workflows

Start workflows from API routes:
src/pages/api/newsletter.ts
import type { APIRoute } from 'astro';
import { start } from 'workflow/api';
import { sendNewsletter } from '../../workflows/newsletter';

export const POST: APIRoute = async ({ request }) => {
  const { subscriberId } = await request.json();
  await start(sendNewsletter, [subscriberId]);
  return Response.json({ message: "Newsletter workflow started" });
};

export const prerender = false;

​
Deployment

When deploying to Vercel with the Astro Vercel adapter: 
npx astro add vercel
The Workflow integration automatically generates the required Vercel functions during the build process.

​
Next steps

Core Concepts

Learn about workflows and steps

API Reference

View the full Astro API reference

Build docs developers (and LLMs) love

Get started for freeTalk to us