本文へ移動
cccskills
無料GitHub で公開

cloudflare-workers

Deploy and manage the portfolio on Cloudflare Workers via OpenNext adapter.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md3.8 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Cloudflare Workers Skill

Deploy and manage the portfolio on Cloudflare Workers using the @opennextjs/cloudflare adapter. The portfolio is a Next.js 16 app compiled to Cloudflare Workers via OpenNext.

When to use this skill

  • Deploying the portfolio to Cloudflare Workers
  • Troubleshooting Cloudflare build failures
  • Configuring wrangler.jsonc or open-next.config.ts
  • Debugging Worker-specific issues (middleware, edge runtime, assets)
  • Updating the @opennextjs/cloudflare or wrangler packages

Current setup

FilePurpose
wrangler.jsoncWorker config: name, compatibility_date, build command, assets
open-next.config.tsOpenNext Cloudflare config (minimal, uses defineCloudflareConfig)
package.jsonScripts: cloudflare:build, cloudflare:dev, cloudflare:deploy

Key configuration

wrangler.jsonc:

{
  "name": "namias",
  "main": ".open-next/worker.js",
  "compatibility_date": "2026-05-29",
  "compatibility_flags": ["nodejs_compat", "global_fetch_strictly_public"],
  "build": {
    "command": "npx opennextjs-cloudflare build --dangerouslyUseUnsupportedNextVersion"
  },
  "assets": {
    "directory": ".open-next/assets",
    "binding": "ASSETS"
  }
}

Note: --dangerouslyUseUnsupportedNextVersion is required because @opennextjs/cloudflare v1.19.x does not officially support Next.js 16.

Workflow

1. Local development

npm run cloudflare:dev

This starts the Worker locally via wrangler dev. Note: may have issues on Windows — use WSL for best results.

2. Build for Cloudflare

npm run cloudflare:build

This runs opennextjs-cloudflare build which:

  1. Runs next build (generates .next/ output)
  2. Bundles the Worker (.open-next/worker.js)
  3. Bundles static assets (.open-next/assets/)
  4. Applies OpenNext code patches

3. Deploy to Cloudflare

npm run cloudflare:deploy

Requires CLOUDFLARE_API_TOKEN and CLOUDFLARE_ACCOUNT_ID environment variables.

4. CI/CD deployment

The cloudflare-deploy.yml workflow:

  1. Triggers on push to main or workflow_dispatch
  2. Runs npm ci → SBOM generation → Cosign signing → npm run cloudflare:deploy
  3. Also deploys Sanity Studio separately

Known limitations

IssueStatus
Next.js 16 middleware.ts conventionDeprecated; use proxy.ts instead. OpenNext detects middleware.ts as Node.js middleware.
output: 'standalone'Set conditionally (isWindows ? undefined : 'standalone') — OpenNext handles its own output
next-sanity peer dependencyRequires next ^14.2 || ^15.0.0 but works with 16.x via the danger flag
Windows buildsOpenNext warns about Windows; use WSL for production builds

Troubleshooting

Build fails with "Node.js middleware is not currently supported":

  • Ensure src/middleware.ts is the file (not src/proxy.ts)
  • The OpenNext adapter detects proxy.ts as Node.js middleware
  • Rename to middleware.ts and export middleware function

Build fails with TypeScript errors:

  • Clear .next/ directory: Remove-Item -Path .next -Recurse -Force
  • Re-run build

Worker deployment fails:

  • Check CLOUDFLARE_API_TOKEN and CLOUDFLARE_ACCOUNT_ID are set
  • Verify the Worker name in wrangler.jsonc matches the Cloudflare dashboard
  • Check Cloudflare Workers dashboard for build logs

Checklist

  • wrangler.jsonc configured correctly
  • open-next.config.ts uses defineCloudflareConfig
  • --dangerouslyUseUnsupportedNextVersion flag is present
  • nodejs_compat compatibility flag is set
  • Build passes locally (npm run cloudflare:build)
  • Deploy succeeds (npm run cloudflare:deploy)
  • Worker responds correctly in Cloudflare dashboard

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Audit and fix accessibility issues across the portfolio to ensure WCAG 2.1 AA compliance.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

Creates a new blog post document in the Sanity studio. Use when the user wants to write a blog post, publish an article, or schedule a future post.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

Creates a new certification document in the Sanity studio. Use when the user wants to add a credential, certificate, or professional accreditation to the Certifications collection.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

Adds a new skill MD file to the studio's skills collection. Use when the user wants to author a new step-by-step recipe for the studio's in-app Skills tool or the .agents mirror.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

Creates a new project document in the Sanity studio. Use when the user wants to add a new portfolio project, a case study, or a work sample to the Projects collection.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

Creates a new experience document in the Sanity studio. Use when the user wants to add a job, role, internship, or work history entry to the Experience collection.

日本語の概要は準備中です。原文の説明を表示しています。

PP-Namias/Portfolio22026年10月7日 更新

PP-Namias のスキルをすべて見る

このスキルの問題を報告する