| name | wrangler-coder |
| description | This skill guides Cloudflare Workers and Pages development with Wrangler CLI. Use when creating Workers, configuring D1 databases, R2 storage, KV namespaces, Queues, or deploying to Cloudflare Pages. |
| allowed-tools | Read Write Edit Grep Glob Bash |
Wrangler Coder
Wrangler is Cloudflare's official CLI for Workers, Pages, D1, R2, KV, Queues, and AI.
Installation
npm install -g wrangler
pnpm add -g wrangler
wrangler --version
Authentication
wrangler login
wrangler whoami
wrangler logout
Environment Variables:
export CLOUDFLARE_API_TOKEN="your-api-token"
CLOUDFLARE_API_TOKEN=op://Infrastructure/Cloudflare/wrangler_token
export CLOUDFLARE_ACCOUNT_ID="your-account-id"
Project Initialization
wrangler init my-worker
wrangler init my-worker --template cloudflare/worker-template
wrangler init
wrangler.toml Configuration
Basic Worker
name = "my-worker"
main = "src/index.ts"
compatibility_date = "2024-12-01"
account_id = "your-account-id"
workers_dev = true
Worker with Routes
name = "api-worker"
main = "src/index.ts"
compatibility_date = "2024-12-01"
account_id = "your-account-id"
routes = [
{ pattern = "api.example.com/*", zone_name = "example.com" },
{ pattern = "example.com/api/*", zone_name = "example.com" }
]
Multi-Environment Configuration
name = "my-worker"
main = "src/index.ts"
compatibility_date = "2024-12-01"
account_id = "your-account-id"
workers_dev = true
[env.staging]
name = "my-worker-staging"
routes = [
{ pattern = "staging-api.example.com/*", zone_name = "example.com" }
]
vars = { ENVIRONMENT = "staging" }
[env.production]
name = "my-worker-production"
routes = [
{ pattern = "api.example.com/*", zone_name = "example.com" }
]
vars = { ENVIRONMENT = "production" }
Cloudflare Products
Secrets Management
wrangler secret put API_KEY
wrangler secret put API_KEY --env production
wrangler secret list
wrangler secret delete API_KEY
export interface Env {
API_KEY: string;
DB_PASSWORD: string;
}
export default {
async fetch(request: Request, env: Env): Promise<Response> {
const apiKey = env.API_KEY;
return new Response(`Key length: ${apiKey.length}`);
}
};
Development Workflow
Local Development
wrangler dev
wrangler dev --env staging
wrangler dev --port 8787
wrangler dev --remote
wrangler dev --persist-to ./data
Testing
npm install -D vitest @cloudflare/vitest-pool-workers
Deployment
wrangler deploy
wrangler deploy --env production
wrangler deploy --dry-run
wrangler deploy --name my-custom-worker
Logs and Debugging
wrangler tail
wrangler tail --env production
wrangler tail --status error
wrangler tail --search "user-id-123"
wrangler tail --ip 1.2.3.4
wrangler versions list
wrangler rollback
Complete Worker Example
See references/worker-example.md for a production-ready Worker with D1, KV, R2 bindings, multi-environment config, and CORS handling.
Best Practices
- Pin compatibility_date - Ensures reproducible behavior across deployments
- Use environments - Separate staging/production configs in same file
- Secrets via CLI - Never commit secrets, use
wrangler secret put
- Local persistence - Use
--persist-to for consistent local dev state
- Tail logs in production - Debug issues with
wrangler tail --status error
- Version control wrangler.toml - Track configuration changes
- Use .dev.vars for local secrets - Add to .gitignore
- Batch D1 operations - Reduce latency with
env.DB.batch()
- Cache strategically - Use KV for frequently accessed data
- Handle errors gracefully - Return proper HTTP status codes