nanoclaw/container/skills/vercel-cli/SKILL.md

name, description

name	description
vercel-cli	Deploy apps to Vercel. Use when asked to deploy, ship, or publish a web application, or manage Vercel projects, domains, and environment variables.

Vercel CLI

You can deploy web applications to Vercel using the vercel CLI.

HARD RULE: You MUST NOT write HTML, CSS, or JavaScript yourself. When asked to build a website or web app, you MUST delegate to a Frontend Engineer subagent (see "Building Websites" section below). This is not optional. Violation wastes your context window on code that belongs in a separate agent.

Auth

Auth is handled by OneCLI — the HTTPS_PROXY injects the real token into API requests automatically. The Vercel CLI requires a token to be present to skip its local credential check, so always pass --token placeholder on every command. OneCLI replaces this with the real token at the proxy level.

Before any Vercel operation, verify auth:

vercel whoami --token placeholder

If this fails with an auth error, collect the credential:

trigger_credential_collection(
  name: "Vercel API Token",
  hostPattern: "api.vercel.com",
  headerName: "Authorization",
  valueFormat: "Bearer {value}",
  description: "Vercel personal access token. Create one at https://vercel.com/account/tokens"
)

Then retry vercel whoami.

Deploying

Always use --yes to skip interactive prompts and --token placeholder for auth (OneCLI replaces with real token).

# Deploy to production
vercel deploy --yes --prod --token placeholder

# Deploy from a specific directory
vercel deploy --yes --prod --token placeholder --cwd /path/to/project

# Preview deployment (not production)
vercel deploy --yes --token placeholder

After deploying, verify the live URL:

# Check deployment status
vercel inspect <deployment-url> --token placeholder

If you have agent-browser available, open the deployed URL and take a screenshot to visually verify.

Project Management

# Link to an existing Vercel project (non-interactive)
vercel link --yes --token placeholder

# List recent deployments
vercel ls --token placeholder

# List all projects
vercel project ls --token placeholder

Domains

# List domains
vercel domains ls --token placeholder

# Add a domain to the current project
vercel domains add example.com --token placeholder

Environment Variables

# Pull env vars from Vercel to local .env
vercel env pull --token placeholder

# Add an env var (use echo to pipe the value — avoids interactive prompt)
echo "value" | vercel env add VAR_NAME production --token placeholder

Common Errors

Error	Fix
Error: No framework detected	Ensure the project has a package.json with a build script, or set the framework in vercel.json
Error: Rate limited	Wait and retry. Don't loop — report to user
Error: You have reached your project limit	User needs to upgrade Vercel plan or delete unused projects
ENOTFOUND api.vercel.com	Network issue. Check proxy connectivity
Auth error after vercel whoami	Credential may be expired. Re-run trigger_credential_collection

Building Websites — Delegate to Frontend Engineer

When asked to build, create, or redesign a website or web app, do NOT build it yourself. You MUST delegate to a Frontend Engineer agent. This is a two-step process and both steps are required:

Step 1 — Create the agent (skip if you already have a "frontend-engineer" destination):

create_agent({
  name: "Frontend Engineer",
  instructions: "You are a dedicated frontend engineer. Your frontend-engineer skill has your full workflow. Build what is requested, test it visually with agent-browser, deploy to Vercel, and send back the live URL + screenshots to your parent agent when done."
})

Step 2 — Send the build request (MANDATORY — do this immediately after step 1):

send_message(to: "frontend-engineer", text: "<full description of what to build, including design requirements, content, colors, and any assets>")

⚠️ CRITICAL: If you skip step 2, nothing happens. The agent exists but has no work. You MUST send the message. Do NOT tell the user "it's working on it" until you have actually called send_message.

After sending, tell the user you've handed it off and will share the result when it comes back. The Frontend Engineer will send you the live URL + screenshots when done — forward those to the user.

When to delegate vs do it yourself:

• Delegate: building new sites, redesigns, multi-page apps, anything that needs visual testing
• Do yourself: simple vercel deploy of an existing project, checking deployment status, managing domains/env vars

Best Practices

• Run npm run build locally before deploying to catch build errors early
• Use --cwd instead of cd to keep your working directory stable
• For Next.js projects, vercel deploy auto-detects the framework — no extra config needed
• Use vercel.json only when you need custom build settings, rewrites, or headers