Деплоим проект в Vercel

Зачем: Инструкция устроена так: сначала настраиваем окружение под твою систему (терминал, Node.js, Vercel CLI, переход в папку проекта), потом идут общие шаги — вход в Vercel и деплой.

Что нужно перед началом

• Локальный проект с package.json и скриптом build (например next build, vite build).
• Node.js — без него Vercel CLI не поставится. Если нет: nodejs.org (бери LTS).

Предварительная настройка

Сделай шаги для своей системы. В конце ты должен оказаться в папке проекта с открытым терминалом и установленной командой vercel.

macOS

1. Открой Терминал

Cmd + Пробел → введи Terminal → Enter Или: Finder → Переход → Утилиты → Terminal.

1. Проверь Node.js

Выполни node -v и npm -v. Если команды не найдены — установи Node.js с nodejs.org (LTS) и вернись сюда.

1. Установи Vercel CLI

npm install -g vercel

Если появится ошибка про права доступа:

sudo npm install -g vercel

1. Перейди в папку проекта

cd ~/projects/my-app

Подставь свой путь. Не знаешь путь — перетащи папку проекта в окно терминала, и путь подставится сам.

Windows

1. Установи Node.js (если ещё не установлен)

Зайди на nodejs.org → скачай LTS → установи (Next → Next) → перезапусти компьютер. Проверь: открой PowerShell (Win → введи PowerShell → Enter), выполни:

node -v
npm -v

Обе команды должны вывести версии.

Если при npm -v ошибка вроде «выполнение сценариев отключено» (PSSecurityException) — в PowerShell разреши запуск скриптов:

Подтверди Y, затем снова выполни npm -v.

1. Открой PowerShell

Win → введи PowerShell → Enter.

1. Установи Vercel CLI

npm install -g vercel

1. Перейди в папку проекта

cd C:\projects\my-app

Подставь свой путь.

Деплой в Vercel

Дальше всё одинаково для macOS и Windows: ты в папке проекта, терминал открыт, Vercel CLI установлен.

1. Войди в Vercel

vercel login

• Выбери способ входа (обычно Continue with GitHub или Email).
• Откроется браузер — подтверди авторизацию (кнопка Allow).

Вернись в терминал.

2. Запусти первый деплой

vercel

Vercel задаст несколько вопросов — отвечай так:

• Вопрос: Set up and deploy?; Что делать: Enter (Yes) — начать настройку и деплой
• Вопрос: Which scope?; Что делать: Стрелками выбери свой аккаунт (личный или команды), Enter
• Вопрос: Link to existing project?; Что делать: No, если деплоишь впервые. Yes — только если привязываешь папку к уже существующему проекту в Vercel
• Вопрос: Project name; Что делать: Enter (оставить предложенное) или введи своё латиницей без пробелов — это попадёт в URL (my-app.vercel.app)
• Вопрос: Directory; Что делать: Enter — оставить ./ (корень проекта)
• Вопрос: Override settings?; Что делать: No — Vercel сам определит фреймворк по package.json

3. Дождись окончания

В терминале побежит лог сборки — это нормально. В конце появится что-то вроде:

✅ Production: https://my-app.vercel.app

Это и есть ссылка на задеплоенный проект.

4. Повторный деплой (когда изменил код)

• vercel — превью-деплой: создаётся отдельная ссылка, основная (Production) не меняется. Удобно проверить изменения перед выкатом.
• vercel --prod — продакшн-деплой: обновляется основная ссылка проекта. Используй, когда готов выкатить изменения «в бой».

vercel

или

vercel --prod

Готово!

Проект доступен по ссылке вида https://your-project.vercel.app. Можно:

• отправить ссылку клиенту;
• подключить свой домен;
• настроить env-переменные в панели Vercel (Dashboard → Project → Settings → Environment Variables);
• деплоить новые версии одной командой.

Частые проблемы

❌ Что-то пошло не так / нужно посмотреть логи

vercel logs

или

vercel inspect

❌ command not found: vercel

Vercel CLI не установлен или путь к npm не в PATH. Проверь установку: перезапусти терминал и выполни снова npm install -g vercel.

❌ Ошибка сборки

Сначала проверь локально: npm run build. Если падает у тебя — на Vercel будет то же самое.

❌ Не подхватываются env-переменные

Добавь их в Dashboard → Project → Settings → Environment Variables.