【Mac】Claude CodeをCLIで使い始めてVS Codeに移行した話｜引っ越しのコツと苦労したこと4選

IT
この記事は約7分で読めます。

育休中、せっかく時間があるうちにAIツールのキャッチアップをしようと思い立ちました。ブログ執筆の効率化や、日頃のIT困りごとの自動化に使えないかと考えていたところ、Claude Codeに辿り着きました。

Claude Codeは、AnthropicのAI「Claude」をターミナル（CLI）から直接呼び出せるツールです。コードを書くのはもちろん、ファイルの読み書き・検索・コマンド実行まで、エージェントとして自律的に動いてくれます。

最初はMacのターミナルから使い始め、しばらく後にVS Codeへ移行しました。この記事では、そのセットアップ手順と移行の流れ、詰まったポイントをまとめます。

この記事でわかること

  • Claude Code CLIのMacへのインストール手順
  • ターミナルからVS Codeへの「引っ越し」をClaude Code自身に手伝わせる方法
  • セットアップで詰まりがちな4つのポイント（Gmail MCP・GAS連携・CLI vs VS Code版の違い・複数プロジェクト管理）

環境

  • MacBook Air（Apple M4）
  • macOS
  • VS Code（最新版）
  • Node.js（インストール済みの前提）

Step 1：Claude Code CLIをインストールする

まずはターミナルから使えるようにします。Node.jsが入っていれば、インストールは1行です。

npm install -g @anthropic-ai/claude-code

インストール後、以下のコマンドで起動できます。

claude

初回起動時にAnthropicのアカウント認証が求められます。ブラウザが開いてOAuth認証が走るので、画面の指示に従ってください。認証が完了すると、ターミナル上でClaude Codeとの対話が始まります。

ターミナルでClaude Code起動画面

! に続けてシェルコマンドを打てば直接実行もできます（これはCLI版のみの機能です。後述します）。

Step 2：VS Codeに移行する

ターミナルでしばらく使っていると、「チャットの文脈がセッションをまたいで引き継げない」という問題に直面します。昨日話したことを今日また一から説明し直す……これが地味にストレスでした。

そこで、VS Codeに移行することにしました。VS Code版のClaude Codeは、プロジェクト単位でCLAUDE.mdというメモリファイルを持てるため、文脈の継続性がターミナル版より管理しやすくなります。

VS Code拡張機能のインストール

VS Codeの拡張機能マーケットプレイスで「Claude Code」を検索してインストールするだけです。CLIが先にインストールされていれば、VS Code版はその認証情報を共有して使います。設定ファイル（~/.claude/settings.json）はCLI版とVS Code版で共有されるため、MCPサーバーの設定なども引き継がれます。

VS CodeでClaude Codeを使っている画面

引っ越しにClaude Code自身を使う

ここが今回の記事で一番伝えたいポイントです。

ターミナルで積み重ねてきた「チャットの成果物」——作ったスクリプト、解決した問題、プロジェクトのコンテキスト——をVS Codeに移すとき、Claude Code自身に「引っ越し作業」を頼みました。

具体的には、ターミナルのClaude Codeに「今まで話してきたことをCLAUDE.mdにまとめて」と依頼。Claude Codeがプロジェクトの文脈を整理し、CLAUDE.mdファイルとして書き出してくれます。このCLAUDE.mdをVS Codeのプロジェクトフォルダに置けば、VS Code版が初回から文脈を把握した状態で動いてくれます。

プロジェクトフォルダ/
├── CLAUDE.md        ← ここに文脈をまとめる
├── src/
└── ...

詰まったポイント4選

詰まり1：Gmail MCPのポート競合

Claude CodeはMCP（Model Context Protocol）という仕組みで外部サービスと連携できます。GmailをClaude Codeから操作したくて @shinzolabs/gmail-mcp を導入したのですが、ここで問題発生。

このMCPサーバーはstdio（標準入出力）とHTTPサーバーを同時に起動する仕様になっています。複数のClaude Codeセッションを立ち上げると、HTTPサーバーが同じポートを取り合ってポート競合エラーが出るのです。

Error: listen EADDRINUSE: address already in use :::3000

しばらく格闘した末に見つけた解決策は、PORT=0（ランダムポート割当）を使うラッパースクリプトを作ること。

#!/bin/bash
# ~/.local/bin/gmail-mcp-wrapper.sh
export PORT=0
exec npx @shinzolabs/gmail-mcp "$@"
chmod +x ~/.local/bin/gmail-mcp-wrapper.sh

~/.claude/settings.json でMCPの起動コマンドをこのラッパースクリプトに向ければ、複数セッションでもポートが衝突しなくなります。

詰まり2：GAS Web App × curlが使えない問題

メールのラベルルールをClaudeから自動更新したくて、Google Apps Script（GAS）でWeb Appを作ってcurlでPOSTするという設計を考えました。しかしGoogleが匿名アクセスを廃止しており、単純なcurlでのPOSTは弾かれてしまいます。

curl -X POST https://script.google.com/macros/s/xxxx/exec -d "data=..."
# → 302リダイレクト or 認証エラー

Googleアカウントのトークン認証まで実装して試したものの、OAuth2のフローをcurlで回すのは思ったより複雑でデバッグに時間を取られました。最終的にはスプレッドシートを直接編集する方針に転換。GASでWeb Appを作る必要がなくなり、むしろシンプルになりました。

教訓：Googleのサービスをcurlで叩くのは2026年現在かなり茨の道。素直にGASのスプレッドシート操作で完結させる方が早いです。

詰まり3：CLI版 vs VS Code版の機能差

VS Codeに移行してから気づいた、CLIとの動作の違いです。

機能CLI版（ターミナル）VS Code版
! でシェルコマンド直打ち✅ できる❌ できない
~/.claude/settings.json 共有✅✅
CLAUDE.md の読み込み✅✅
ファイル操作・コード実行✅✅
VS Codeのファイルツリー参照❌✅

「!ls -laでディレクトリ確認」が習慣になっていたのですが、VS Code版ではこれができません。「Bashでls -laを実行して」と指示するか、VS Codeのエクスプローラーで確認する形になります。逆にVS Code版では、開いているファイルのコンテキストが自動的に共有されるのが便利です。

詰まり4：複数プロジェクトのCLAUDE.md管理

育休中に並行して進めていたプロジェクトが増えていくにつれ、CLAUDE.mdとメモリの使い分けが悩ましくなってきました。最終的に落ち着いたルールは以下のとおりです。

  • CLAUDE.md（プロジェクトルートに置く）→ そのプロジェクト固有のルール・背景・よく使う手順をまとめる。Claudeが毎回読む「説明書」のイメージ。
  • ~/.claude/CLAUDE.md（ホームに置く）→ 全プロジェクト共通のルール（「コミットメッセージは日本語で書く」「個人情報のマスク方針」など）。

この2層構造にしてから、「前の会話を一から説明し直す」ストレスがかなり減りました。

まとめ

  • Claude Code CLIは npm install -g @anthropic-ai/claude-code で1発インストール
  • VS Codeへの移行は、CLAUDE.mdにターミナルでの成果を書き出すことでスムーズに行える
  • ~/.claude/settings.json はCLI版とVS Code版で共有されるのでMCP設定は1回で済む
  • Gmail MCPのポート競合はPORT=0のラッパースクリプトで回避
  • GASへのcurlアクセスは2026年現在かなり難しい。スプレッドシート直接操作に逃げるのが早い
  • 複数プロジェクトはCLAUDE.mdを「プロジェクト固有」と「全体共通」の2層で管理するのが吉

育休中という時間があるうちにAI開発環境を整えられたのは、復職後のワークフロー改善にも確実に活きそうです。

コメント

タイトルとURLをコピーしました