vscodeの拡張 Todo Treeで認識してくれないコメント中のTODOも認識させる方法

【6/19開催】Kong Community Japan Meetup #4
本イベントでは、Kong Inc. のVP of ProductであるReza Shafii氏もプレゼンターとして参加。当社からはアーキテクト マネージャーの槌野の登壇が決定!参加無料です!!

【6/21開催】開発者目線でのSBOMとの向き合い方
SBOMの導入から開発者がSBOMの作成・管理を自動で行っていくための方法(デモ)を紹介します。

【7/5開催】azd+Terraform? ~ポイントを押えてAzure上へのアプリケーション環境をラクチン構築~
ツールの概要説明から、実際の開発におけるポイントをお伝えします!

【7/19開催】現場で役立つAzure神小技10+α 〜生成AI,RAG,コスト削減など旬な技術満載のLT大会〜
Azureの最新技術や実用的な小技を紹介する特別なライトニングトーク大会を開催します!

【7/26開催】最適なIaCツールを選ぼう
プロジェクトでのツール選びに困らないための重要な観点をご説明します!

はじめに

皆さんこんにちは。PSSLの2年目エンジニアの細川です。

今回は短めの記事ですが、VSCodeのTodo Treeという拡張機能に関するtipsを共有しようと思います。

Todo Treeとは

Todo Treeは開いているディレクトリ内のすべてのTODOをリストアップしてくれる拡張機能になります。

https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree

皆さんも、あとでやろうと思ったことを、TODOというコメントなどを書いて残しておくこともあるかと思います。

そういう時に、Todo Treeの拡張機能を入れておくと一覧で表示してくれたり、画像のようにHighlightしてくれるので非常に便利です。

TODOはもちろん、BUG、FIXMEなどのタグも使えます。

デフォルトで様々な言語のコメントアウトに対応しており、コメント中に書いても正しく認識されるのですが、たまに認識してくれない言語もあります。例えば、マークダウンのコメントや、TypeScriptの複数行コメントアウトなどです。

[](マークダウンのコメント)

/**
 * TypeScriptの複数行コメントアウト
 */

試しに、先ほどのTODOコメントを複数行コメントにしてみます。

 

すると、デフォルトでは認識してくれないので、ハイライトされなくなっています。

 

認識してくれないコメント中のTODOに反応させるには

デフォルトで認識してくれないものを認識させるようにするには、settings.jsonに以下の行を追加します。

{
	// ... そのほかの設定
  "todo-tree.regex.regex": "(\\[\\]\\(|\\*\\s|//|#|<!--|;|/\\*|^|^[ \\t]*(-|\\d+.))\\s*($TAGS)"
}

デフォルトで対応している文頭の正規表現に、[](で始まるものと* (アスタリスク+半角スペース)で始まるものを追加しています(デフォルトの設定はこちら)。これで、マークダウンのコメントやTypeScriptの複数行のコメントの中でも、以下のように、正しく認識してくれるようになります。

他のコメントアウトの場合も同様の手法で正しく認識してくれるようになりますので、よろしければ参考にしてください。

終わりに

今回はTodo Treeのtipsについてまとめてみました。

皆さんの参考になれば幸いです。今後もこのようなtipsがあれば共有したいと思います。他にもこちらのようなTypeScriptの情報等を挙げているのでよろしければのぞいてみて下さい。

 

 

アバター画像
About 細川 15 Articles
高専専攻科制御系の学科を卒業後、2022年にサイオステクノロジーに入社。入社後は、バックエンド, フロントエンドの開発に携わり、Go言語やTypeScriptを用いた開発を行っている。その他、React, Next.JS, Nest.JS, GraphQLなど
ご覧いただきありがとうございます! この投稿はお役に立ちましたか?

役に立った 役に立たなかった

0人がこの投稿は役に立ったと言っています。


ご覧いただきありがとうございます。
ブログの最新情報はSNSでも発信しております。
ぜひTwitterのフォロー&Facebookページにいいねをお願い致します!



>> 雑誌等の執筆依頼を受付しております。
   ご希望の方はお気軽にお問い合わせください!

Be the first to comment

Leave a Reply

Your email address will not be published.


*


質問はこちら 閉じる