cloudflare

Deploy and operate Rango router applications on Cloudflare Workers with D1 and KV bindings.

Updated Nov 7, 2025
One-click install
npx skills add https://github.com/rangojs/rango --skill cloudflare-rangojs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cloudflare
Source: https://github.com/rangojs/rango/tree/main/packages/rangojs-router/skills/cloudflare
Command: npx skills add https://github.com/rangojs/rango --skill cloudflare-rangojs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Deploying a React Server Components router to Cloudflare Workers involves tricky details: typed D1/KV bindings, local migration parity, streaming responses that break when buffered, dev-versus-preview differences, and webhook signature verification with WebCrypto. This Skill provides tested configuration and operational guidance for the entire lifecycle. ## Core Features & Use Cases - Worker configuration: Set up the Cloudflare Vite plugin with the Rango preset, wrangler.json, and typed bindings via a global Rango.Env interface. - D1/KV and local parity: Provision bindings, apply local and remote migrations, manage .dev.vars secrets, and run the same behavior suite against vite dev and vite preview. - Streaming and deployment safety: Preserve RSC/SSR response streams, handle route-owned CORS, deploy the built Worker from dist/rsc/wrangler.json, and debug dev-preview differences. - Use Case: You are moving a Rango app to Cloudflare Workers and need D1 migrations applied locally, a Stripe webhook verified with SubtleCrypto, and a deployable Worker built without draining the streaming response. ## Quick Start Use the cloudflare skill to configure and deploy my Rango app on Cloudflare Workers with typed D1 and KV bindings.

Frequently Asked Questions about cloudflare

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I deploy a Rango app to Cloudflare Workers?

Run vite build, then deploy with wrangler deploy -c dist/rsc/wrangler.json. The build emits a deployable Worker configuration under the RSC environment output; never deploy the source main from the root config because Wrangler cannot reconstruct Rango's Vite virtual modules.

How do I set up D1 and KV bindings in a Cloudflare Workers app?

Create resources with wrangler d1 create and wrangler kv namespace create, then copy the returned IDs into wrangler.json under d1_databases and kv_namespaces. Keep binding names identical in wrangler.json and your AppBindings TypeScript interface so ctx.env.DB resolves correctly.

Why does my RSC streaming response break on Cloudflare Workers?

Calling response.text() or response.arrayBuffer() on the Rango response drains the RSC/SSR stream. Rewrap with new Response(response.body, response) when only headers must change, and avoid diagnosing streaming with wrangler dev since local gzip compression can buffer responses.

Does vite preview match production behavior for Cloudflare Workers?

The Cloudflare Vite plugin runs the Worker in workerd during vite dev and vite preview with the same binding shape as deployment. However, preview loads .dev.vars copied during the last build, so rebuild after changing secrets, and run your behavior suite against both dev and preview.

How do I verify Stripe webhooks on Cloudflare Workers?

Use Stripe 22, which publishes a workerd export using fetch and SubtleCrypto, and call the asynchronous Stripe.webhooks.constructEventAsync with the raw request body. Read the exact bytes via ctx.request.text() since signature verification requires the original payload.

Why does my CORS preflight work in preview but fail after deployment?

Vite's CORS middleware answers preflight OPTIONS before the Worker in both dev and preview, so a passing preview preflight does not prove your route's own OPTIONS branch works. Set server.cors and preview.cors to false and assert the full CORS headers on real responses.