VSCode のオレオレ extension を作りたいと思った。作りたいよね？
Your First Extension | Visual Studio Code Extension API
↑に従って開発を始めた。
global install はしたくない & 普段 pnpm を使っているので、コマンドを微修正しながら進めた。
pnpm init pnpm install yo generator-code pnpm yo code
prompt に対する回答は以下のようにした。
_-----_ ╭──────────────────────────╮
| | │ Welcome to the Visual │
|--(o)--| │ Studio Code Extension │
`---------´ │ generator! │
( _´U`_ ) ╰──────────────────────────╯
/___A___\ /
| ~ |
__'.___.'__
´ ` |° ´ Y `
? What type of extension do you want to create? New Extension (TypeScript)
? What's the name of your extension? code-block-input
? What's the identifier of your extension? code-block-input
? What's the description of your extension?
? Initialize a git repository? Yes
? Which bundler to use? none
? Which package manager to use? pnpm
その後、Extension Development Host window を開いたのだが、目当ての Hello World が見つからない。
エラーらしきものはないし、QuickStart の一番最初からつまづいた。
console には Deprecation Warning がでているのみ。
(node:91877) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead. (Use `Code Helper (Plugin) --trace-deprecation ...` to show where the warning was created)
パッと思いつく要因は
- pnpm を使う場合にバグがある
- pnpm x TypeScript で開発する場合にバグがある
- extension の名前を kebab-case にしているのがまずい
何度でも作り直しが効くので、何パターンかためしてみることにした。 （余談だが、実行したコマンドのメモをとっておくと、こういう時にコピペで済むので楽だ。）
- pnpm x JavaScript, project 名を sample にしたら成功
- pnpm x TypeScript, project 名を sample にしたら成功
これらが成功するということは、 どうやら kebab-case にしたのが原因？と思ったところで、
? Do you want to open the new folder with Visual Studio Code? Open with `code`
の設問が気になった。もしかしたら vscode の project root をどこにするかの問題なのでは？と思って検証したらビンゴ。
要は、
├── vscode-extensions # ここで pnpm init などを実行 │ ├── sample # `yo code` によって生成されたファイル │ ├── node_modules │ ├── package.json │ ├── pnpm-lock.yaml
F5 を押す時に extension の root （上の図なら sample/）を project root として開いていないと Helloworld が見つからない、という話だった模様。
package を global install していたら簡単に気づける問題だったが、生成された directory にも package.json が作られているので混乱した。
kebab-case でも 問題なく extension はつくれた。
