前提

拡張機能のコーディングが完了していること

前置き

普段、IDE(統合開発環境)として、vscode(Visual Studio Code) を利用しています。
多くの拡張機能があるため、実際に利用していて特に問題なかったのですが、「半角スペースを使って良い感じに見栄えを揃える」という作業が発生したことがあります。
vscode では複数行を一つのカーソルで選択ができる機能があるため、その時は ~~面倒に感じながらも~~ 普通に作業をするよりは早く対応ができました。
『自分達が目で見て分かりやすい』状態を保つことはとても重要だと思います。ですが、作業があまり生産的ではないことも事実…。
vscode の拡張機能を作る記事をいくつか拝見し、せっかくなのでやってみよう！という気持ちになり、作成をしてみました。
そして、自分が実際の業務でも使いたいと思ったため、公開もしました。
その時の備忘録メモとして、まとめていきます。

公開するための準備

1. Publisher ID を控える(アカウント作成)

https://aex.dev.azure.com/me?mkt=ja-JP にアクセス
(GitHub アカウントで認証をし、登録しました)
Azure DevOps組織 > プロジェクトにアクセス
Browse marketplace を押下
Publish extensions を押下(右上のメニュー)
Owner の箇所をhoverして、Publisher ID を控える

※ 隠す必要がない情報もマスクしています。

2. package.json に必要な情報を設定

必須

{
  "publisher": ""
}

作成したアカウントのPublisher ID を設定してください

任意

{
    "icon": "",
	"repository": {
		"type": "git",
		"url": ""
	}
}

icon は「128px × 128px」推奨
「package.json が置いてあるディレクトリ」からの相対パスを指定
※ 指定する画像に、SVGは利用非推奨。
repository > url に、ソースコードを管理しているURLを指定

公開する

公開する方法は
「vsceコマンドにお任せ」 or 「vsix拡張子のvscodeに取り込むファイルをアップロードする」
の 2通りあるようです。

方法1. コマンド経由で公開

アクセストークンを生成する
- https://docs.microsoft.com/ja-jp/azure/devops/organizations/accounts/use-personal-access-tokens-to-authenticate
- 最低限、下記の設定は必須となります
  1. Organization: 「All accessible organizations」
  2. Scopes: 「Custom defined」
  3. Marketplace: 「Acquire」と「Manage」を選択

ローカルで、下記のコマンドを実行する

 $ vsce login ${Publisher ID}
 # ここで、1で生成したアクセストークンを入力して、認証をする
 $ vsce publish

方法2. サイトからアップロードして公開

ローカルで下記のコマンドを実行し、 vsix拡張子のファイルを作成する
```
 $ vsce package
```
Azureのアップロード画面を開き、1のファイルをアップロードする
- https://marketplace.visualstudio.com/manage/publishers
- 新規の場合
  1. New Extension を押下
  2. Visual Studio Code を押下
  3. 1で生成したvsix拡張子のファイルをアップロード
  4. Upload を押下
- バージョンアップの場合
  1. 「...(More Actions)」を押下
  2. Update を押下
  3. 1で生成したvsix拡張子のファイルをアップロード
  4. Upload を押下
reCAPTCHA認証を行う
以下のメッセージが表示されればOK

※ 反映までに少し時間がかかります

感想

アカウント作成や公開するページに辿り着くまでにやや時間がかかりましたが、思った以上に簡単に公開することができました。
公開をしてみて感じたことですが、「公開できた安心」と同時に「（こんな内容で）公開して大丈夫か…？」という不安にも駆られました（最終的には「使いたい人だけ使うでしょう！」と開き直りました）。

思った以上に、簡単に公開できました。実際にやってみて、
コマンド経由で簡単にできることも魅力でしたが、個人的には、Marketplace の画面から公開する方が安心感がありました（アクセストークンの管理が面倒）。
どちらの方法でも公開やバージョンアップができることは確認できましたので、個人のリリースフローに合わせた形で良さそうです¹。

Marketplaceのサイトからアップロードする手順は、実は、公開する以外の用途でも使えます。
vsix拡張子のファイルを作成し、そのファイルをを共有すれば、他の環境でも利用することが可能になります。 ↩

vscodeの拡張機能(Extension)を公開するまで

前提

前置き