Frameworks On Cloudflare

cloudflare/skills/skills/frameworks-on-cloudflare

作者 cloudflare6eb6c781aa9b6438e0c7307bd102788a75fe1a6d無授權條款3.2K 個星標收錄於 2026年11月7日更新於 2026年11月7日儲存庫今天更新

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.

AI 產生的概覽

指導在 Cloudflare Workers 上建置、遷移與部署 Web 框架應用程式(Astro、SvelteKit、React Router、Nuxt、Hono、SPA 等)。

功能
先檢查儲存庫中的框架、版本、套件管理器、算繪模式、配接器與 Cloudflare 設定,據此判斷專案狀態,並指向對應的 Workers 框架指南與上游官方 agent 指引。涵蓋新建專案、已有 Wrangler 設定的專案,以及尚無 Cloudflare 設定的專案,並將變更限制在整合所需的配接器、執行環境、建置與部署設定上。也建議在部署前執行框架檢查與建置並在本機驗證 Worker,新應用程式優先採用 Workers Static Assets 而非 Pages。
適用情境
當 Astro、SvelteKit、React Router、TanStack Start、Nuxt、Hono 或 React/Vue SPA 等框架專案要以 Cloudflare Workers 為目標,或框架儲存庫中已包含 Workers 部署設定時使用。
執行需求
僅為說明文件,不含腳本。需要存取專案儲存庫及其設定檔,並參考相關的 Cloudflare Workers 框架指南與配套技能(例如 wrangler、cf、cf-cli 或框架專屬技能)來完成設定與部署。

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 [blocked].

來源與署名

來源:cloudflare/skills位於skills/frameworks-on-cloudflare提交6eb6c78

授權條款: 無授權條款

內容歸原作者所有。SourceWeft 從公開儲存庫中收錄這些內容。

在 README 中新增徽章

向讀者展示該技能已收錄於 SourceWeft,徽章連結到本頁。

「Listed on SourceWeft」徽章預覽
[![Listed on SourceWeft](https://sourceweft.com/badge/skills/gh-cloudflare-skills-frameworks-on-cloudflare-skills-frameworks-on-cloudflare-2c06b36c1f48521e.svg)](https://sourceweft.com/skills/gh-cloudflare-skills-frameworks-on-cloudflare-skills-frameworks-on-cloudflare-2c06b36c1f48521e?utm_source=readme&utm_medium=badge)

檢舉或申請下架