色々出来ますね。
先月も作ってましたが、先月はコードスニペットなので値を登録すればVSCodeが良しなにやってくれるという感じでした。
今回はTypeScriptのコードを書いて実行するという意味でもうちょっと拡張っぽい拡張を作っています。Pandocユーザー会で上がっていた機能を実現するVSCodeの拡張を書いてみようと思い立ち、2日くらいかけてつくってみました。VSCodeのマーケットプレースはここですが、VSCodeの拡張探すところでpandocで検索してもらえれば見つかります。
また、GitHubのリポジトリはこちら。何か問題みつけたらIssueに書いてもらえれば。
https://github.com/niszet/pandocplay
今回は、Visual Studio Code実践ガイド—最新コードエディタを使い倒すテクニックのサンプルコードをかなり参考にして作りました。参考というか、これを下書きにして書いたり消したりですね。なので、拡張名もサンプルの名前にあやかってつけてます。
VSCode実践ガイドについて
実はまだ全部は読み切っていないのですが、上に書いた通り拡張機能としてTypeScriptのコードを書いていく実例が書かれているので参考になりました。徹底解説の方と比べるとこちらの方がより上級者向けの内容になってます。VSCode初心者で使い始めという場合は徹底解説の方を先に読んだ方が良いかな。実践ガイドの方はTypeScript、Go、Pythonの開発の話（徹底解説はTypeScript/Nodeのみ）があり、Language Server Protocol(LSP)は実践ガイドの方にだけある、みたいに押さえている内容の幅は実践ガイドの方が広いです（なので、より中～上級者向けと言える）。必要な内容やレベル感に合わせて選ぶと良さそうです。
VSCodeをはじめとする各種ツールやサービスはUIの見た目が結構変わるので、書籍のキャプチャ画像と実際のそれとで違うこともあるのですが、項目がまるっと消えているということはあまりなく（移動している場合は名前は同じ、とか）、読み進められると思います。そういう意味では変化の速いものを扱った書籍は鮮度が大事なので大変ですよね（ぼやき
拡張まわりとLSPはまだわかってないことが多いのでしばらくお世話になりそうです。
沼っぽい…。
同様に、VSCodeの拡張のAPIについては最終的には公式のドキュメントを見て確認が必要となりますが、そこの説明が微妙にわかりづらいとか微妙に会ってない気がするとか、既にある拡張のjsonを眺めると無効なkeyがあったりとか、ちゃんと作ろうとすると結構大変な感触でした。なのでなかなか沼っぽいですね。さっきまで動いていたのに動かない…みたいなのがあったり…。
まだ未実装の機能があったり、TypeScriptっぽく書けてなかったり、Test書いてなかったり、READMEに実際の操作をしている画像を貼るのが出来てなかったり、全体的の仕様的によくわかってない部分がまだあるので引き続きやっていこうと思います。
Enjoy!!
