Skill60 repo starsupdated 3mo ago

deploy-vercel

View source Repository: funnel-architect-plugin

Install in Claude Code

Copy

git clone --depth 1 https://github.com/ominou5/funnel-architect-plugin /tmp/deploy-vercel && cp -r /tmp/deploy-vercel/skills/deploy-vercel ~/.claude/skills/deploy-vercel

Then start a new Claude Code session; the skill loads automatically.

Definition

SKILL.md

# Deploy to Vercel

Best for React/Next.js funnels and projects that benefit from edge functions.

## Prerequisites
- Node.js installed
- Vercel account (free Hobby tier works for funnels)

## Setup

```bash
# Install Vercel CLI
npm install -g vercel

# Login
vercel login

# Deploy (first time — will prompt for config)
vercel

# Deploy to production
vercel --prod
```

## Configuration (`vercel.json`)

```json
{
  "headers": [
    {
      "source": "/(.*).html",
      "headers": [{ "key": "Cache-Control", "value": "public, max-age=300" }]
    },
    {
      "source": "/(.*).css",
      "headers": [{ "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }]
    },
    {
      "source": "/(.*).js",
      "headers": [{ "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }]
    }
  ],
  "redirects": [
    { "source": "/old-page", "destination": "/new-page", "permanent": true }
  ],
  "cleanUrls": true,
  "trailingSlash": false
}
```

## Custom Domain
1. Go to **Project settings → Domains**
2. Add your domain
3. Update DNS: add A record `76.76.21.21` or CNAME to `cname.vercel-dns.com`
4. SSL is automatic

## Environment Variables
```bash
# Add via CLI
vercel env add VARIABLE_NAME

# Or via Dashboard: Project settings → Environment Variables
```

## Framework Support
Vercel auto-detects: Next.js, React (Vite/CRA), Astro, and static HTML.
No additional configuration needed for supported frameworks.