VSCode の拡張機能をつくる練習として、開いているワークスペースの Git の情報から、 GitHub のパーマリンクをクリップボードにコピーする拡張機能を作った。練習なので壊れているかもだけどよければお使いください。
remote (origin) の URL 、 HEAD のハッシュ、開いているファイル名、カーソル行の行番号をくっつけた、 https://github.com/hogashi/sketch-20200411-vscode-ext-git/blob/47b96dd6cc7c521d9ab017ce7760d62536cbb4cc/src/extension.ts#L4 みたいな URL をクリップボードに入れる。選択範囲で見ているので、複数行選択しているときはその範囲の URL になる ( https://github.com/hogashi/sketch-20200411-vscode-ext-git/blob/47b96dd6cc7c521d9ab017ce7760d62536cbb4cc/src/extension.ts#L4-L6 みたいな)。
remote の URL は難しくて、 ssh:// git:// https:// とか git@ とか(末尾の) .git とかがあったりするので、正規表現で雑に頑張って消している。 ssh のときはドメイン名とパス名の間は : になるのでこれをスラッシュにしたりもしている。
つくり方のコーナー
最初の最初はここを見ながらつくった。 yo code ですべてが登場する。
初 VSCode 拡張機能で Git の情報を取るコードを書くのは至難の業で、なんとか行き着いた先で「この .d.ts ファイルをコピーして使ってな」みたいなことが書いてある。実際この src/api/git.d.ts を一緒に置いて import { GitExtention } from './git' とかやると急に型がつく。
vscode/README.md at 433380c3c16c73c7e711dedf20de12760160bc7b · microsoft/vscode · GitHubAPI
The Git extension exposes an API, reachable by any other extension.
- Copy
src/api/git.d.tsto your extension's sources;- Include
git.d.tsin your extension's compilation.- Get a hold of the API with the following snippet:
const gitExtension = vscode.extensions.getExtension<GitExtension>('vscode.git').exports; const git = gitExtension.getAPI(1);
あとは型のおかげで出るそれっぽい API を眺めたり、 API リファレンスを見たりしつつ、コミットハッシュを取ったり、行番号を取ったり、クリップボードに書き込んだりして完成した。
ところで公開はまたひと苦労で、公開するドキュメントを見ながらやろうとするけど vsce がどうやっても 401 を返してくる。ちょっと検索すると FAQ が後からできているらしくて、そこでは上で述べられていた内容と真逆なことが書いてあってそんな……となる (token の権限は全部許可してくれみたいなことが書いてある)。
code.visualstudio.com
