# Vercel

> How a publish from midcode becomes a Vercel deploy through your git push, and what connecting your Vercel account adds to the Publish panel.

- Page: https://midcode.app/docs/publish/vercel
- From the midcode docs. Every page as Markdown: https://midcode.app/llms.txt

If your repository is connected to a Vercel project, publishing from midcode is a deploy. midcode commits the files you chose and pushes them, and Vercel builds from that push as it does from any other. midcode needs no access to Vercel for this, and adds nothing to your build.

Connecting your Vercel account in midcode is optional and does one thing: after a publish, the panel shows the deploy that push started, until it's live.

## Publish is the deploy

Nothing changes in how your project deploys:

- A push to your production branch is a production deploy.
- A push to any other branch is a preview deploy, with its own address to share. [Branches](https://midcode.app/docs/publish/publish.md) in midcode are a quick way to get one.

After a push, [Publish](https://midcode.app/docs/publish/publish.md) says so whether or not an account is connected: "pushed. If the project is connected to Vercel, the deploy has started."

## Follow the deploy

With an account connected, one more line appears under the published commit:

| The line | What it means |
| --- | --- |
| "Deploying on Vercel…" | Vercel is building the commit you pushed, or hasn't picked it up yet. |
| "Live on Vercel" | The production deploy is ready. "Open" opens it. |
| "Preview ready on Vercel" | A preview deploy is ready. "Open" opens its address. |
| "The Vercel deploy failed" | The build failed. "See logs" opens the deploy on Vercel. |

midcode checks every 4 seconds while that panel is open, for up to 15 minutes.

## Connect your account

Open Settings with `⌘,`. Under "Connections", click "Connect" beside Vercel. There are three ways in.

### Sign in with Vercel

1. Click "Sign in with Vercel".
2. midcode shows a code and opens Vercel's device page in your browser.
3. Type or confirm the code on that page.
4. midcode says "Connected to Vercel as your-username".

This is the Vercel CLI's own sign-in (`vercel login`), which midcode runs for you. If the CLI isn't installed, midcode runs the latest one through `npx`, which needs Node on your Mac. When it finishes, midcode takes the token the CLI saved. So the account is signed in to the Vercel CLI on your Mac too.

### Use my Vercel CLI login

This button shows when the Vercel CLI is already logged in. midcode uses the token it has.

### Use a token instead

1. Click "Use a token instead".
2. Paste a token from your Vercel account settings. "Create one" opens that page.
3. Click "Connect".

midcode checks the token with Vercel before it keeps it. "Disconnect" makes midcode forget it. It doesn't revoke the token on Vercel and it doesn't log the CLI out.

## How midcode finds your deploy

midcode has to work out which Vercel project is this folder, then which deploy is this commit.

1. If the folder was linked with `vercel link`, it reads the project from `.vercel/project.json`.
2. Otherwise it looks for the Vercel project whose git repository is your `origin`, first in your own account and then in each of your teams.
3. It reads that project's ten latest deploys and takes the one built from the commit you pushed.

```json title=".vercel/project.json"
{
  "projectId": "prj_…",
  "orgId": "team_…"
}
```

That file is written by the Vercel CLI, not by midcode. midcode only reads it.

## What midcode does with Vercel

It reads four things, and every request is a read:

- Who the account is.
- Your teams, to find the project.
- The project connected to your repository.
- That project's latest deploys and their state.

It never does these:

- Start, cancel or promote a deploy.
- Change a project's settings, domains or environment variables.
- Add a build step, a config file or a dependency to your project.
- Read your other projects' deploys.

The token is kept the same way as [GitHub's](https://midcode.app/docs/publish/github.md): encrypted with the macOS Keychain, in the app's main process only, and sent to `api.vercel.com` and nowhere else.

## Other hosts

Netlify, Cloudflare Pages and any other host that builds from a git push deploy when you publish, in the same way. Following the deploy inside midcode is for Vercel.

## Limits

- midcode matches a deploy to your commit through the GitHub commit Vercel records for it. Following a deploy was built for repositories on GitHub. With a repository on GitLab or Bitbucket the deploy still happens, but following it wasn't tried.
- The deploy shows after a publish made in midcode, in that panel. There's no list of past deploys.
- midcode looks at your account and your first 20 teams, and at a project's ten latest deploys.

## Troubleshooting

**No deploy line after publishing.** Either no Vercel account is connected, or midcode found no Vercel project for this repository in your account and teams. Run `vercel link` in the project's folder, then quit and reopen midcode: the project it found, or didn't, is remembered until you quit.

**It follows the wrong project.** When several Vercel projects build from the same repository (a monorepo), midcode takes the first one Vercel returns. Run `vercel link` in the folder you open in midcode, so `.vercel/project.json` names the right one.

**"Deploying on Vercel…" never changes.** Vercel hasn't made a deploy for that commit. Check on Vercel whether the branch is one it builds and whether the repository is still connected.

**The site deployed but the styles are missing.** In a project without Tailwind, `midcode.css` has to be in the commit. See [Without Tailwind](https://midcode.app/docs/styling/without-tailwind.md) and, to build the file on Vercel instead, [The midcode package](https://midcode.app/docs/styling/package.md).