Vite plugin

import { Render } from "~/components";

The Cloudflare Vite plugin enables a full-featured integration between Vite and the Workers runtime. Your Worker code runs inside a local workerd process, which closely matches the runtime APIs and behavior of deployed Workers.

Features

• Uses the Vite Environment API to integrate Vite with the Workers runtime
• Provides direct access to Workers runtime APIs and bindings
• Builds your front-end assets for deployment to Cloudflare, enabling you to build static sites, SPAs, and full-stack applications
• Produces standard Build Output for cf build and cf deploy
• Official support for TanStack Start and React Router v8 with server-side rendering
• Leverages Vite's hot module replacement for consistently fast updates
• Supports vite preview for previewing your build output in the Workers runtime prior to deployment

Use cases

• TanStack Start
• React Router v8
• Static sites, such as single-page applications, with or without an integrated backend API
• Standalone Workers
• Multi-Worker applications

Get started

To create a new application from a ready-to-go template, refer to the TanStack Start, React Router, React or Vue framework guides.

To create a standalone Worker from scratch, refer to Get started.

For a more in-depth look at adapting an existing Vite project and an introduction to key concepts, refer to the Tutorial.