Visual Studio Codeとスニペット・ドキュメント検索アプリの「Dash」連携を行うプラグイン

普段スニペットアプリはAlfredを使っていますが、コーディング関連のスニペットはすべてDashにまとめるようにしています。
理由としてはDashの方がコードに特化しているからと、Alfredと分けておくことで普段使いの方に余計な接頭辞を付ける必要がなくなります。
- コードのハイライト機能など、コードに特化している
- 「Dashを起動 = コーディング関連」が成立する(それ以外はAlfred)
- Dashはリファレンス検索機能もあるので、スニペット検索だけでなく調べ物もできる
ちなみに、Visual Studio Code自体にもスニペット機能がありますが、エディタに依存するような形でスニペットを保存してしまっていると、他のエディタで使用できないので使っていません。
今回はそんなコーディング特化のスニペットツールであるDashとVisual Studio Codeの連携方法についてです。
普通にDashを起動してペーストでも問題ありませんが、連携するとさらに使いやすくなります。
Visual Studio CodeのDash拡張機能をインストール

まずはDashのVisual Studio Code拡張機能をインストールしましょう。
もちろんDash自体のインストールも必要ですが、特に連携を意識する必要はなく、Visual Studio Codeの拡張機能とDashが揃っていればすぐに使えます。
Dashの呼び出し方法
ショートカットキーでDashを起動できます。
いずれもカーソル下のテキストが自動で選択されて、Dashで検索されます。
わざわざテキストのコピーやドキュメントの絞り込みが不要になって、ショートカットキーを押せばある程度絞り込まれた状態になるのが、拡張機能を使うメリットです。
| ショートカットキー | 内容 |
|---|---|
| control + h | ファイルをもとに言語の絞り込みをした状態で検索 |
| control + option + h | すべての言語・ドキュメントセットの中から検索 |
| control + shift + h | ファイルをもとにドキュメントセットの絞り込みをした状態で検索 |
| option + h | 検索ボックスが表示されて、そこに入力した内容で検索 (ファイルをもとにドキュメントセットの絞り込みはされる) |
全部で4つショートカットキーがあり、うまく使い分けながら使うのは大変なので、基本的にcontrol + option + hを使えばよさそうです。
option + hに関しては、下記のようにVisual Studio Code上に検索ボックスが表示されます。

入力したテキストがDash上で検索されて、ドキュメントセットに関しては、Visual Studio Codeで開いているファイルから自動で検出されて絞り込みがされます。




gulpのwatch機能を使って、監視ファイルに変更があった時にタスクを実行する
Gitで1行しか変更していないはずのに全行変更した判定になってしまう
Nuxt.jsでaxios-moduleを使ってAPIからデータを取得・表示する|Nuxt.jsの基本
Visual Studio Codeで読み込んだCSSで設定されているclass名の入力補完をしてくれる拡張機能「HTML CSS Support」
Visual Studio CodeでCSVの編集を見やすく行う拡張機能「Edit csv」
横幅が広がったときの挙動が変わる!CSS Gridの「auto-fill」と「auto-fit」の違い
Gitで最初に設定しておくユーザー名とメールアドレスのグローバル設定
Vue CLIのtitleタグやmetaタグの設定方法
Google Maps APIでピンの見た目をカスタマイズする方法
スマホやPCにプッシュ通知をしてくれる「Push7」をブログに追加する方法
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
無料版でも高機能なランチャーアプリ「Raycast」の基本機能と環境設定
OnyXでターミナルを使わずにmacOSの詳細設定を行う
軽量で高速なターミナルエミュレーター「Ghostty」の設定方法
Eagleで実現するクリエイティブ素材の簡単管理
かゆいところに手が届く「Supercharge」でMac環境を便利にカスタマイズする
超軽量なコードエディタ 「Zed」をサブエディタとして活用する
Bartender 6で追加されたWidgets機能で自作メニューバーアイテムを簡単に作成する
Googleカレンダーを便利に活用するための小技集(祝日だけを表示・月末の繰り返しイベントを追加)
Obsidianを使った「自己流PKM」で行う知識トレーニング
テキストエディタ・ノートアプリ関連のショートカットキーをKeyboard Maestroで統一する