majiayu000 Setup Vercel Workflow
Vercel CLIのインストールから認証までを対話的にサポートする。
Instructions
1. 前提条件チェック
Node.jsがインストールされているか確認:
node --version # v18以上推奨
npm --version
Node.jsがない場合は先にインストールが必要。
2. 環境チェック
# Vercel CLIがインストールされているか
vercel --version
# 認証状態の確認
vercel whoami
3. インストール（未インストールの場合）
# npm（グローバル）
npm install -g vercel
# pnpm
pnpm install -g vercel
# yarn
yarn global add vercel
4. 認証
# ブラウザ認証（推奨）
vercel login
認証フロー:
- コマンド実行後、ブラウザが開く（または URLが表示される）
- 表示されたURLにアクセス
- 画面に表示されるコードを確認
- Vercelアカウントでログイン（GitHubアカウント連携推奨）
- 「Authorize」をクリック
5. 認証確認
# ログイン状態を確認
vercel whoami
# 期待される出力:
# > username
6. アカウント作成（未登録の場合）
- https://vercel.com/signup にアクセス
- 「Continue with GitHub」を選択（推奨）
- GitHubアカウントで認証
- Hobby（無料）プランを選択
- 完了後、
vercel loginを再実行
Hobbyプラン（無料）の制限
| 項目 | 制限 |
|---|---|
| 帯域幅 | 100GB/月 |
| ビルド時間 | 6,000分/月 |
| プロジェクト数 | 無制限 |
| デプロイ数 | 無制限 |
| プライベートリポジトリ | 対応 |
※ 商用利用はProプラン（$20/月）が必要
トラブルシューティング
トークンが無効
# 再ログイン
vercel logout
vercel login
権限エラー（npm グローバルインストール）
# sudoを使う（非推奨）
sudo npm install -g vercel
# または npxで実行（インストール不要）
npx vercel
npx vercel login
GitHubリポジトリ連携エラー
VercelダッシュボードでGitHub Appの権限を確認:
- https://vercel.com/account/integrations にアクセス
- GitHubの「Configure」をクリック
- 必要なリポジトリへのアクセスを許可
確認コマンド
# 状態確認
vercel whoami
vercel teams ls # チーム一覧（あれば）
# プロジェクト一覧
vercel projects ls
成功条件
vercel whoamiでユーザー名が表示されるvercel --prodでデプロイが実行できる