Ploy
Ploy
CLI

ploy vite

Run Cloudflare Vite apps with ploy.yaml-managed config.

ploy vite

Use ploy vite for Cloudflare Vite projects, including React apps that ship a worker from worker/index.ts and TanStack Start apps that use the Cloudflare adapter.

Ploy reads ploy.yaml, generates the temporary Wrangler config internally, and passes it to the Cloudflare Vite toolchain. You do not need to commit wrangler.json or wrangler.jsonc for these setups.

Commands

ploy vite build [options]
ploy vite dev [options]

Options

FlagDescriptionDefault
--ploy-config <path>Path to ploy.yamlauto-detected
...argsAdditional arguments for Vitenone

Any extra arguments are forwarded to the underlying Vite command.

When to use it

Use ploy vite when your project has both:

  • a Vite config
  • @cloudflare/vite-plugin installed

For plain workers, use ploy dev / ploy build. For Next.js, use ploy dev with @meetploy/nextjs.

React + Worker Example

This setup matches examples/vite-full.

package.json
{
	"scripts": {
		"build": "tsc --noEmit && ploy vite build",
		"dev": "ploy vite dev",
		"types": "ploy types -o env.d.ts"
	}
}
ploy.yaml
kind: dynamic
build: pnpm build
out: dist
compatibility_date: "2026-03-23"
assets:
  binding: ASSETS
  not_found_handling: single-page-application
  run_worker_first:
    - /api/*
    - "!/api/docs/*"
db:
  DB: default
vite.config.ts
import { cloudflare } from "@cloudflare/vite-plugin";
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

export default defineConfig({
	plugins: [react(), cloudflare()],
});

For non-TanStack projects, Ploy looks for a worker entry at worker/index.ts or the corresponding JavaScript/MJS variants.

TanStack Start Example

This setup matches examples/tanstack-start-prerender.

package.json
{
	"scripts": {
		"build": "ploy vite build && tsc --noEmit",
		"types": "ploy types -o env.d.ts"
	}
}
ploy.yaml
kind: dynamic
build: pnpm build
out: dist
compatibility_date: "2026-03-17"
compatibility_flags:
  - nodejs_compat
vite.config.ts
import { cloudflare } from "@cloudflare/vite-plugin";
import { tanstackStart } from "@tanstack/react-start/plugin/vite";
import viteReact from "@vitejs/plugin-react";
import { defineConfig } from "vite";

export default defineConfig({
	plugins: [
		cloudflare({ viteEnvironment: { name: "ssr" } }),
		tanstackStart({
			prerender: {
				enabled: true,
				autoSubfolderIndex: true,
				crawlLinks: false,
				failOnError: true,
			},
		}),
		viteReact(),
	],
});

When @tanstack/react-start is installed, Ploy automatically maps the Cloudflare worker entry to @tanstack/react-start/server-entry.

Assets

Use the top-level assets key in ploy.yaml to control static asset behavior for dynamic Vite deployments.

ploy.yaml
assets:
  binding: ASSETS
  not_found_handling: single-page-application
  run_worker_first:
    - /api/*
    - "!/api/docs/*"
  • binding exposes the asset fetcher to your worker as env.ASSETS
  • not_found_handling: single-page-application enables SPA fallback behavior
  • run_worker_first lets API routes or other patterns bypass the asset layer

Local Development

pnpm ploy vite dev

This starts Cloudflare Vite dev mode with the config synthesized from ploy.yaml. If your app also uses Ploy bindings like db, generate types with ploy types first so env.d.ts stays current.

Build

pnpm ploy vite build

This runs the production Cloudflare Vite build using your ploy.yaml compatibility settings and asset config.

Notes

  • Keep compatibility settings in ploy.yaml, not in wrangler.json.
  • Use assets for static file behavior instead of Cloudflare-only config files.
  • If you need a custom Ploy config path, run ploy vite build --ploy-config path/to/ploy.yaml.
  • If you need to pass Vite's own --config, forward it directly: ploy vite build -- --config vite.config.custom.ts.

How is this guide?

Last updated on