ちまたで話題のChatGPTをVSCodeで動かして、開発環境をイケイケにできるらしいということで早速導入してみました。 zenn.dev

VSCodeのChatGPTプラグイン、クラスのDocstrings書かせるのにめちゃくちゃ使える！いろいろうまく使えそうなのでどんどん使っていこう。CopilotでどうでもいいコードをTab連打で爆速で埋めていって、ChatGPTと会話しながらブラッシュアップしていく開発スタイル最高では🤩 pic.twitter.com/odn9MnqaZP
— いのいち (@inoichan) 2023年3月18日

しかし、非常に残念なことに、ChatGPTのプラグインを導入した瞬間に当プラグインがマーケットプレースより削除されてしまいました...。

【悲報】ツイート直後にvscode-chatgptがマーケットプレースから削除されたため、最高の開発スタイルが10分で終了 https://t.co/drNBtqpNQp
— いのいち (@inoichan) 2023年3月18日

幸運にもこのExtensionの作者の方がGithubにコードを公開してくれていましたので、最高の開発スタイルを奪取すべく手元で動かす方法をメモに残そうと思います。

vscode-chatgptの環境構築

Codes: GitHub - gencay/vscode-chatgpt: A Visual Studio Code extension to support ChatGPT. The extension is pair-programmed with ChatGPT.

基本的にはREADME.mdのHow to runに従います。環境などが整ってなかった部分をメモしてます。

環境はUbuntu 20.04でVSCodeのVersionは1.73.1です。

0. yarnのインストール

環境にyarnが入っていませんでしたので、インストールします。

classic.yarnpkg.com

npmも入ってませんので中段のAlternativesを見てインストールしました。（あとで結局nodejsをインストールしたのでnpmでインストールしてもいいと思います。）

curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list

sudo apt update && sudo apt install yarn

.bashrcをエディタで開いて以下を追加。

export PATH="$PATH:/opt/yarn-[version]/bin"

1. Repositoryのクローン

cd ~
git clone https://github.com/gencay/vscode-chatgpt.git

2. 依存関係のインストール

cd vscode-chatgpt/
yarn

puppeteerがインストールされていないエラーが出たので、ChatGPTに聞いて解決方法を教えてもらう。

yarn add puppeteer

これを実行して再度yarnを実行しました。

3. 実行

vscode-chatgptをVSCodeで開き、F5を押して実行すればOK。 npmが入ってなくて実行できないエラーがでたので、nodejsとnpmをインストール。この記事を参考にしました。

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
nvm install 14.4.0

再度、F5を押して実行。

これで動かすところまでは一旦できました。

4. VSIX fileを作成してExtensionsに追加

上記の方法で動かした場合、F5を押して作成されたVSCodeのウインドウにしかChatGPTが出てきません。すべてのVSCodeでChatGPTが出てきてほしいです。ローカルのパッケージはVSIXというファイルにして直接Extensionsにインストールできるようです。 ChatGPTにVSIXファイルの作成方法を聞きました。

vsce codes: GitHub - microsoft/vscode-vsce: VS Code Extension Manager

Ubuntuの場合は以下を実行します。

sudo apt-get install libsecret-1-dev
npm install --global @vscode/vsce

その後、vscode-chatgpt以下で以下を実行してvsix fileを作成します。

npx vsce package

これでvscode-chatgpt-3.9.7-0.vsixというファイルが作成されました。

最後にVSIXからExtensionをインストールします。

Managing Extensions in Visual Studio Code

code --install-extension vscode-chatgpt-3.9.7-0.vsix

もしくは、VSCode内でCtrl + Shift + Pでパレットを開いて、vsixと入力すると、ファイルからインストールの欄が出てきます。

これで無事に最高の開発環境を復活させることができました。

他にもより良いExtensionsが出てくると思いますが、とりあえず動いてよかったです。

いのいち勉強日記

Turingで自動運転の開発をしています。京大でPhDをとりました。Kaggle Grandmasterです。

削除されてしまったvscode-chatgptを動かす方法