vinext
Documentation menu

Documentation

Deploy to Cloudflare Workers

Use vinext's native Workers integration for bindings, caching, and image optimization.

The native Cloudflare integration is the most complete deployment target. It runs App Router server code in workerd and supports Workers bindings directly in your application.

1. Configure the project

pnpm dlx vinext init --platform=cloudflare

The initializer creates or updates vite.config.ts and wrangler.jsonc, then lets you choose caching and image optimization. Commit these generated config files.

2. Authenticate

pnpm dlx wrangler login

Add your Cloudflare account ID to wrangler.jsonc, or set CLOUDFLARE_ACCOUNT_ID. In CI, use a CLOUDFLARE_API_TOKEN instead of browser login.

3. Deploy

pnpm dlx @vinext/cloudflare deploy
pnpm dlx @vinext/cloudflare deploy --env staging

The deploy command validates the initialized setup, builds all Vite environments, and deploys the Worker. Use --preview for the preview environment.

Use Workers bindings

Import env from cloudflare:workers in Server Components, Route Handlers, and Server Actions. Configure each binding in Wrangler as usual.

import { env } from "cloudflare:workers";

export default async function Page() {
  const posts = await env.DB.prepare("SELECT * FROM posts").all();
  return <pre>{JSON.stringify(posts.results)}</pre>;
}

See Cloudflare's bindings documentation for product-specific configuration, and the Workers Vite plugin documentation for the underlying development environment.