AutoGineer
Generated banner for Frameworks On Cloudflare
Generated logo for Frameworks On Cloudflare

Frameworks On Cloudflare

CloudflareOfficialPublished by Cloudflare

  • Skill
  • Tool integration
  • Cloud and DevOps
  • Apache-2.0
  • No issues found
Download ZIP

From the author

Build, migrate, and deploy web-framework applications on Cloudflare Workers. Use when a framework project such as Astro, SvelteKit, React Router, TanStack Start, Nuxt, Hono, or a React or Vue SPA targets Cloudflare, or when a framework repository contains Workers deployment configuration.
— the description by Cloudflare

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

This skill provides a structured approach to deploying web applications built with frameworks like Astro, SvelteKit, React Router, TanStack Start, Nuxt, and Hono onto Cloudflare Workers. It emphasizes maintaining the framework as the primary development interface while utilizing Workers as the deployment target. The skill outlines how to assess existing project configurations, select the appropriate setup path based on whether the project is new or existing, and integrate necessary adapters or build configurations.

What it does

  • Identifies the framework, package manager, and existing configuration in a repository.
  • Provides specific setup paths for new projects versus existing projects with or without Wrangler configuration.
  • Directs users to framework-specific Workers guides for adapters and runtime configuration.
  • Advises on verifying builds and local Worker behavior before deployment.
  • Offers a standardized process for reporting feedback or issues regarding the skill's guidance.

When to use it

  • When starting a new web-framework project intended for Cloudflare Workers.
  • When migrating an existing framework application to run on Cloudflare Workers.
  • When updating deployment configurations for a framework already running on Cloudflare.
  • When troubleshooting build or deployment issues for framework-based Workers applications.

Advantages

  • Ensures consistent deployment practices across various popular web frameworks.
  • Helps distinguish between static site deployment and on-demand rendering requirements.
  • Prevents common configuration errors by identifying existing Wrangler setups.
  • Provides clear pathways for both new and legacy project structures.

Usage examples

“How do I deploy my existing SvelteKit project to Cloudflare Workers?”
The agent will guide you to inspect your current configuration, verify if you have Wrangler set up, and follow the SvelteKit-specific Workers guide to install and configure the @sveltejs/adapter-cloudflare adapter.
“I want to start a new Hono project on Cloudflare. What should I do?”
The agent will direct you to the Hono Workers guide for creating a new project, ensuring you choose between an API-only Worker or a full-stack application setup.

Install

  1. Download the skill as a ZIP:

    https://autogineer.com/agent-skills/cloudflare/frameworks-on-cloudflare/download

  2. Unzip it into the cross-client skills folder of your project:

    mkdir -p .agents/skills && unzip frameworks-on-cloudflare.zip -d .agents/skills

Documentation by Cloudflare

Build with frameworks on Cloudflare

Use the framework as the primary development interface and Cloudflare Workers as the deployment target. Serve static sites and SPA output with Workers Static Assets. Do not select Pages templates, Pages deployment commands, or Pages-specific presets for new applications. Preserve existing Pages deployments during unrelated maintenance.

Route the project

  1. Inspect the repository before changing it. Identify the framework, installed version, package manager, rendering mode, existing adapter, and Cloudflare configuration: cloudflare.config.ts, or wrangler.jsonc, wrangler.json, or wrangler.toml.

  2. Preserve the user's framework choice. Determine whether the task starts a new project, adapts an existing project, or changes only application code.

  3. Read only the matching row below, its Workers framework guide, and the framework's own agent guidance.

  4. Set up the project for its state:

    • New project: follow the framework's Workers guide for project creation. The guides currently create the project with C3 and configure it for Wrangler; this is an exception to the cloudflare skill's default of cf for new projects, because the cf docs do not yet cover creating framework projects. After creation, the project has Wrangler configuration, so the next bullet applies.

    • Existing project with Wrangler configuration: keep Wrangler and load the wrangler skill. Follow the framework guide for adapter and configuration changes. Do not run cf init ., cf dev, cf build, or cf deploy in it.

    • Existing project with no Cloudflare configuration: use cf, which detects supported frameworks and configures them; see Start from an existing project and the cf-cli skill. Detection does not mean the project builds. If the build fails or the framework is not supported, follow the framework guide's manual setup.

  5. Change only the adapter, runtime, build, and deployment configuration the integration requires. Inspect generated package scripts, run the framework's checks and build, then verify the Worker locally before deployment.

FrameworkWorkers setupOfficial upstream agent guidance
Next.jsLoad the nextjs-on-cloudflare skill.Listed in that skill.
TanStack StartFollow the Workers guide, which uses the Cloudflare Vite plugin. Distinguish Start from standalone TanStack Router.Use TanStack Intent to discover and load installed package skills, including Start's deployment guidance.
React RouterIdentify Framework, Data, or Declarative mode. Follow the Workers guide for full-stack setup. SPA mode is not supported with the Cloudflare Vite plugin, and prerendering has version requirements; check the guide before choosing either.Load the official React Router skill, its matching mode reference, and installed package docs when available.
SvelteKitFollow the Workers guide, which uses @sveltejs/adapter-cloudflare.Use Svelte's official skills and AI setup guidance.
HonoChoose an API-only Worker or a frontend plus API. The Cloudflare guide covers Hono with a React SPA; use Hono's Workers guide for an API-only app.Load the application skill from honojs/skills.
AstroDistinguish fully prerendered output from on-demand rendering: a static site deploys as static assets, and on-demand rendering uses @astrojs/cloudflare. Follow the Workers guide.Use Astro's official AI guidance and docs MCP.
NuxtFollow the Workers guide for the current Nitro integration and bindings.Use the Nuxt docs MCP; load the Nuxt UI skill only when using Nuxt UI.
React or Vue SPAFollow the React + Vite or Vue Workers guide. Distinguish a client-only SPA from a full-stack framework.Use the chosen framework's official guidance for application development.

For other frameworks, start from the framework guides index.

Skill feedback

If the user reports that this skill gave incorrect or outdated guidance, or is missing information, read references/skill-feedback.md.

Files

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Security

No issues found by our static scan· No issues found

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Attribution and licence

Published by
Cloudflare
Publisher
Cloudflare (Official)
Source
cloudflare/skills · skills/frameworks-on-cloudflare · commit 6eb6c78
Licence
Apache License 2.0 (redistribution allowed)
  • LICENSE (added by AutoGineer from LICENSE)
  • ATTRIBUTION.md (written by AutoGineer)
Synced

AutoGineer is not affiliated with or endorsed by Cloudflare or Cloudflare.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download frameworks-on-cloudflare.zip