未ログイン状態で閲覧中
  • 投稿日:2026/03/27
  • 更新日:2026/04/04
Claude Code を VS Code で使うには!?(Mac版)拡張機能インストール完全ガイド

Claude Code を VS Code で使うには!?(Mac版)拡張機能インストール完全ガイド

会員ID:LxAeMm40

会員ID:LxAeMm40

この記事は約9分で読めます
要約
CLIの「黒い画面は苦手…」という方に! VS CodeにClaude Code拡張機能を追加すれば、馴染みのある画面でAIをすぐ使い始められます。インストール方法を画像付きで丁寧に解説します。 ※Desktop版で支障がある場合や、VS Code上で直接使いたい方向けです。

はじめに

この記事では、AIアシスタント「Claude」をコードエディタ「VS Code」の画面上で使える「VS Code拡張機能版 Claude Code」のインストール手順を、わかりやすく解説します。

※基本的には Claude Code Desktopアプリ版の利用をおすすめしています。本記事は、Desktop版が利用できない場合や、VS Code上で直接使いたい方向けの手順です。
Desktopアプリ版はこちらの手順はこちらの記事をご参照ください。


この記事で紹介すること

🟠 VS Code にClaude Codeの拡張機能をインストールする手順

🟠 インストール後に実際にClaude Codeを動かすところまで

🟠 2026年3月26日時点・Claude Code バージョン 2.1.84 の情報です(画面は変わっている場合があります)


はじめる前に確認してください

✅️ 18歳未満の方はClaudeを利用できません

続きは、リベシティにログインしてからお読みください

ノウハウ図書館でできること
  • すべての記事の閲覧

  • ブックマーク

  • いいね・レビュー

  • 記事の投稿※応援会員(有料)のみ

  • ポイントの獲得※応援会員(有料)のみ

※会員登録には、新入生会員(初月30日無料)と応援会員(有料)があります

応援会員制度とは?
さらに!
  • リベシティの他の機能やサービスもご利用いただけます詳しく見る

ブックマークに追加した記事は、ブックマーク一覧ページで確認することができます。
あとから読み返したい時に便利です。

会員ID:LxAeMm40

投稿者情報

会員ID:LxAeMm40

パンダ会員

この記事に、いいねを送ろう! 参考になった記事に、
気軽にいいねを送れるようになりました!
この記事のレビュー(2
  • 会員ID:fmaDKPHf
    会員ID:fmaDKPHf
    2026/04/06

    困っていたので、とっても参考になりました😊🙏✨

    会員ID:LxAeMm40

    投稿者

    2026/04/06

    困っていたところに役立てたとのこと、嬉しいです!😊 ありがとうございます。

    会員ID:LxAeMm40

    投稿者

  • 会員ID:skSTSQ9G
    会員ID:skSTSQ9G
    2026/04/02

    ゼリさん、参考にさせて頂きました。 全くどうしていいかわからなかったけど、 丁寧に記載されていたので、ファイルまで 作成出来ました(≧∇≦)/ さて、これからどうやって 働いてもらおうか思案中です(笑)

    会員ID:LxAeMm40

    投稿者

    2026/04/03

    レビューありがとうございます😊 無事にファイルまで作成できたとのことで、お役に立てて嬉しいです! 私もまだ手探りで使っているところなので、「これからどう働いてもらうか」は同じく思案中です(笑) ぜひ一緒に試行錯誤しながら、うまく使いこなしていきましょう✨

    会員ID:LxAeMm40

    投稿者