こんにちは！kirigayaです 
VSCodeからGoogle Antigravityへ移行した時のメモを残します 
ついでにAntigravity使って記事にしました 
Review機能すごく使いやすい！ 
あなたも反重力を体験しよう！反重力って.... 
<img src="https://storage.googleapis.com/zenn-user-upload/5c0c041108c1-20251125.png" alt="" class="md-img" loading="lazy">
<h1 id="google-antigravity-%E5%B0%8E%E5%85%A5%E3%81%A8%E8%A8%AD%E5%AE%9A" data-line="9" class="code-line">
<a class="header-anchor-link" href="#google-antigravity-%E5%B0%8E%E5%85%A5%E3%81%A8%E8%A8%AD%E5%AE%9A" aria-hidden="true"></a> Google Antigravity 導入と設定</h1>
Google Antigravity は、VS Code をベースにした AI ネイティブな IDE です。エージェント機能とエディタ機能が統合されており、コーディング体験を大きく変える可能性を秘めています。 
この記事では、Antigravity を VS Code ライクに快適に使うための導入と設定方法を紹介します。
<h2 id="%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB" data-line="14" class="code-line">
<a class="header-anchor-link" href="#%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB" aria-hidden="true"></a> インストール</h2>
Antigravity は専用の<a href="https://antigravity.google/" target="_blank" rel="nofollow noopener noreferrer">インストーラー</a>からインストールします。 
インストール後は、VS Code と似たインターフェースが表示されますが、左側にエージェント管理画面があるのが特徴です。
<h2 id="%E8%A8%AD%E5%AE%9A%EF%BC%9A%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%83%9E%E3%83%BC%E3%82%B1%E3%83%83%E3%83%88%E3%83%97%E3%83%AC%E3%82%A4%E3%82%B9%E3%81%AE%E5%A4%89%E6%9B%B4" data-line="19" class="code-line">
<a class="header-anchor-link" href="#%E8%A8%AD%E5%AE%9A%EF%BC%9A%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%83%9E%E3%83%BC%E3%82%B1%E3%83%83%E3%83%88%E3%83%97%E3%83%AC%E3%82%A4%E3%82%B9%E3%81%AE%E5%A4%89%E6%9B%B4" aria-hidden="true"></a> 設定：拡張機能マーケットプレイスの変更</h2>
デフォルトでは OpenVSX 等が設定されている場合がありますが、VS Code の公式マーケットプレイスを利用できるように設定を変更することで、使い慣れた拡張機能をそのまま利用できるようになります。
<ol data-line="23" class="code-line">
<li data-line="23" class="code-line">
設定を開く: <code>Settings</code> -&gt; <code>Antigravity Settings</code> -&gt; <code>Editor</code> へ移動します。
</li>
<li data-line="24" class="code-line">
URL を更新する: 以下の項目を VS Code の公式 URL に変更します。
<ul data-line="26" class="code-line">
<li data-line="26" class="code-line">
Marketplace Item URL:<div class="code-block-container"><pre><code class="code-line" data-line="27">https://marketplace.visualstudio.com/items
</code></pre></div>
</li>
<li data-line="30" class="code-line">
Marketplace Gallery URL:<div class="code-block-container"><pre><code class="code-line" data-line="31">https://marketplace.visualstudio.com/_apis/public/gallery
</code></pre></div>
</li>
</ul>
</li>
<li data-line="35" class="code-line">
再起動: 設定変更後、Antigravity を再起動します。
</li>
</ol>
これで、拡張機能の検索やインストールが VS Code と同様に行えるようになります。
<h2 id="%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%83%BC%E6%A9%9F%E8%83%BD%E3%82%92%E3%82%AA%E3%83%B3%E3%81%AB%E3%81%99%E3%82%8B" data-line="39" class="code-line">
<a class="header-anchor-link" href="#%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%83%BC%E6%A9%9F%E8%83%BD%E3%82%92%E3%82%AA%E3%83%B3%E3%81%AB%E3%81%99%E3%82%8B" aria-hidden="true"></a> ブラウザー機能をオンにする</h2>
Web ブラウジング機能を活用するために、以下の Chrome 拡張機能をインストールすることをお勧めします。
<a href="https://chromewebstore.google.com/detail/antigravity-browser-exten/eeijfnjmjelapkebgockoeaadonbchdd" target="_blank" rel="nofollow noopener noreferrer">Antigravity Browser Extension</a>
<img src="https://storage.googleapis.com/zenn-user-upload/70e9265894dd-20251125.png" alt="" class="md-img" loading="lazy">
<h2 id="%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%A8%E7%92%B0%E5%A2%83%E6%A7%8B%E7%AF%89" data-line="47" class="code-line">
<a class="header-anchor-link" href="#%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%A8%E7%92%B0%E5%A2%83%E6%A7%8B%E7%AF%89" aria-hidden="true"></a> 拡張機能のインストールと環境構築</h2>
マーケットプレイスの設定が完了したら、必要な拡張機能をインストールして環境を整えましょう。
<h3 id="%E3%81%8A%E3%81%99%E3%81%99%E3%82%81%E3%81%AE%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD" data-line="51" class="code-line">
<a class="header-anchor-link" href="#%E3%81%8A%E3%81%99%E3%81%99%E3%82%81%E3%81%AE%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD" aria-hidden="true"></a> おすすめの拡張機能</h3>
<ul data-line="52" class="code-line">
<li data-line="52" class="code-line">
テーマとアイコン: <code>GitHub Theme</code> や <code>vscode-icons</code> などを入れると、見た目が VS Code に近づき違和感が減ります。</li>
<li data-line="53" class="code-line">
AMP: コマンドラインツールやドキュメント作成に便利な拡張機能です。API Key を使用してログインします。</li>
<li data-line="54" class="code-line">
CodeX: CodeX は直接ダウンロードリンクがない場合があるため、VS Code からエクスポートしてインポートします。
<ol data-line="55" class="code-line">
<li data-line="55" class="code-line">
VS Code で準備: VS Code に CodeX 拡張機能がインストールされていることを確認します。</li>
<li data-line="56" class="code-line">
エクスポート: VS Code の拡張機能管理画面から CodeX を探し、<code>.vsix</code> ファイルとしてエクスポートします。</li>
<li data-line="57" class="code-line">
インポート: Antigravity の拡張機能パネルを開き、メニューから「Install from VSIX...」を選択します。</li>
<li data-line="58" class="code-line">
インストール: 先ほどエクスポートした <code>.vsix</code> ファイルを選択してインストールします。</li>
</ol>
</li>
</ul>
<h3 id="%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF%E8%A8%AD%E5%AE%9A%E3%81%AE%E6%9C%80%E9%81%A9%E5%8C%96" data-line="60" class="code-line">
<a class="header-anchor-link" href="#%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF%E8%A8%AD%E5%AE%9A%E3%81%AE%E6%9C%80%E9%81%A9%E5%8C%96" aria-hidden="true"></a> エディタ設定の最適化</h3>
既存の VS Code の <code>settings.json</code> の内容（インデント、フォーマット設定など）を Antigravity のワークスペース設定にコピーすることで、移行コストを最小限に抑えることができます。
<ol data-line="63" class="code-line">
<li data-line="63" class="code-line">
VS Code の設定を開く: VS Code でコマンドパレット (<code>Cmd+Shift+P</code>) を開き、<code>Preferences: Open Settings (JSON)</code> を実行して <code>settings.json</code> の内容をコピーします。</li>
<li data-line="64" class="code-line">
Antigravity の設定を開く: Antigravity でも同様にコマンドパレットを開き、<code>Preferences: Open Settings (JSON)</code> を実行します。</li>
<li data-line="65" class="code-line">
貼り付け: コピーした内容を Antigravity の <code>settings.json</code> に貼り付けます。
<ul data-line="66" class="code-line">
<li data-line="66" class="code-line">※ Antigravity 特有の設定と競合しないよう、必要な部分（フォーマットやエディタの挙動など）を選んで移行することをお勧めします。</li>
</ul>
</li>
</ol>
<div class="code-block-container"><pre class="language-json"><code class="language-json code-line" data-line="67"> //背景色
 "workbench.colorCustomizations": {
 	"tab.activeBackground": "#020c1f",
 	"activityBar.background": "#000000",
 	"sideBar.background": "#000000",
 	"tab.activeBorder": "#d19a66",
 	"editor.background": "#021628",
 },
</code></pre></div><h2 id="%E7%8F%BE%E6%99%82%E7%82%B9%E3%81%A7%E3%81%AE%E7%A7%BB%E8%A1%8C%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88%E3%81%A8%E3%83%87%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88" data-line="78" class="code-line">
<a class="header-anchor-link" href="#%E7%8F%BE%E6%99%82%E7%82%B9%E3%81%A7%E3%81%AE%E7%A7%BB%E8%A1%8C%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88%E3%81%A8%E3%83%87%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88" aria-hidden="true"></a> 現時点での移行に関するメリットとデメリット</h2>
最後に、現時点で VS Code から Antigravity へ移行する際のメリットとデメリットをまとめます。
<h3 id="%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88" data-line="82" class="code-line">
<a class="header-anchor-link" href="#%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88" aria-hidden="true"></a> メリット</h3>
<ul data-line="83" class="code-line">
<li data-line="83" class="code-line">
強力なエージェント統合: エージェント機能とエディタがシームレスに統合されており、コード修正の速度と完了率が高いです。</li>
<li data-line="84" class="code-line">
VS Code ベースの親和性: 基本的な操作感は VS Code そのものであり、設定変更により VS Code の豊富な拡張機能エコシステムを活用できます。</li>
</ul>
<h3 id="%E3%83%87%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88%E3%83%BB%E8%AA%B2%E9%A1%8C" data-line="86" class="code-line">
<a class="header-anchor-link" href="#%E3%83%87%E3%83%A1%E3%83%AA%E3%83%83%E3%83%88%E3%83%BB%E8%AA%B2%E9%A1%8C" aria-hidden="true"></a> デメリット・課題</h3>
<ul data-line="87" class="code-line">
<li data-line="87" class="code-line">
カスタマイズ性の制限: GitHub Copilot Chat のようなカスタムプロンプトやエージェントの作成が現状では制限されています。</li>
<li data-line="88" class="code-line">
モデルの選択肢: OpenAI や Anthropic などの主要な最新モデルがネイティブに統合されておらず、GitHub Copilot に劣る部分があります。</li>
<li data-line="89" class="code-line">
安定性: リリースしてからまだ短い時間で、安定性が保たれていない可能性があります。</li>
</ul>

VSCodeからGoogle Antigravityへ

設定：拡張機能マーケットプレイスの変更

拡張機能のインストールと環境構築

現時点での移行に関するメリットとデメリット

kirigaya

Antigravityは反重力かと…

ありがとうございます

Discussion