Scribble at 2021-03-11 20:41:54 Last modified: 2021-03-12 10:34:17

添付画像

To try out the new theme, press F5 to launch an Extension Development Host window.

There, open the Color Theme picker with File > Preferences > Color Theme and you can see your theme in the drop-down list. Arrow up and down to see a live preview of your theme.

Color Theme

こんな説明じゃ、「意味分かんない」と言う人がフォーラムに続出するのはあたりまえだ。"Extension Development Host" なんていう名前のデバッグ・ツールは存在しないんだから。エディタ画面上で「F5」を叩くだけだと、"Select Environment" というコマンド入力欄が出てくるだけで、なんにも起きない。で、どうやって "Extension Development Host" というステータスになってるウインドウを開くのか、実は検索しても殆どまともな回答や手順を書いている人がいないし、ヒットするページは5年位前のぜんぜん UI が違ってる画面での手順を説明してるページばかりだ。実際問題として、@theme でパッケージを検索しても日本人が作ったテーマなんて一つも出てこないわけで、要するに大半の人はローカルで自分用に JSON ファイルを編集しているにすぎず、満足のゆく配色にしてしまったらデバッグの手順なんて忘れてしまうのである。

次に、"To test modified colors, press the debug icon and run "Extension" command." と書いている事例もあるが、そんなことで "Extension Development Host" というモードのウィンドウが開くわけがない。そもそもコマンド・パレットやターミナルの入力ボックスで使えるコマンドに "Extension" など存在しない。

そして、"Press F5 or choose and execute the Run Extension option in the debug window." と説明しているページもあるようだが、"Run Extension" なんてコマンドは VSC に存在しない。"Run" なんていうコマンドはメニュー以外にはなく、サイドバーのデバッグ用ペインで入力する欄には選択肢すら出てこない。

そろそろ正しい手順を説明しておく。まずテーマをデバッグするには、テーマの JSON コードなどを収めてあるパッケージのフォルダを workbench に登録して、そこから themename-color-theme.json ファイルを開いた状態で F5 を押さなくてはいけない。このファイルを反映させた "Extension Development Host" モードの〈見本ウィンドウ〉を開くという感覚で、単にメニューから JSON ファイルを開いて F5 を押すだけでは、デバッグの対象になっていないのである。こうして、(F5 でウィンドウが出てこない場合は、左のペインに "Run and Debug" のサイドバーが出たら、一番上にある入力ボックスで Run の後にドロップ・ダウンのメニューとしても選べる中から "Extension (themename)" となっているものを選べば、)"Extension Development Host" というモードになった別のウィンドウが立ち上がる。そして、メインのウィンドウにはデバッグ用の小さなフローティング・バーが出てくる。ここまで前提を含めて説明して、初めてフリーな状態からの手順を正しく説明したことになるのだ。大多数の説明は最初の前提、つまりパッケージのフォルダを workbench に登録して、そこから "Extension Development Host" モードのウィンドウに反映させたい設定が書かれているファイルを開くという必須の前提を完全に欠落した状態で、自分にとっての〈空気〉であるかのように無視しているからこそ、読んでいる人には「そんなもん動かないぞ」という結果しか与えられないのである。実際、これに気づくまで僕自身が何度も繰り返して失敗し、下記の URL で読めるやり取りの、"The reason for not showing up the Extension Development Host window by pressing F5 in the first place is because my VS code workspace is not inside the project directory. The project directory contains the setup for launching the Extension Development Host window in launch.json. So, If I want to suggest then I would say that VS code workspace needs to be inside the project folder directory." という、これも後から付け足された説明だが、これを見てやっと仕組みが分かったのである。

https://stackoverflow.com/questions/65503178/pressing-f5-is-not-working-in-vs-code-to-open-new-window-for-debugging-my-custom

  1. もっと新しいノート <<
  2. >> もっと古いノート

冒頭に戻る


※ 以下の SNS 共有ボタンは JavaScript を使っておらず、ボタンを押すまでは SNS サイトと全く通信しません。

Twitter Facebook