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で開いているファイルから自動で検出されて絞り込みがされます。




Visual Studio Codeの拡張機能「Trailing Spaces」でコードの中にある余計なスペースを表示する
ダミーとして使うURLは適当に入力せず、決まったものを使うようにしよう
スライドを簡単に実装できるJavaScriptライブラリ「Swiper」
Visual Studio Codeの基本|概要やインストールから日本語化など最低限の設定方法
Local by Flywheelのページ遷移を軽くする設定
js-cookieでウェブサイトのダークモード表示設定をユーザーごとに保存しておく方法
Vue Routerでページ遷移後にトーストを表示させる方法
Google Maps APIでピンをクリックしたときに吹き出しを表示する方法
アイコンフォントをPCにインストールしている場合は、コーディング後の確認に注意
SourceTreeでBacklogのGitを使うときに、権限エラーになってしまう場合の解決法
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
マウス操作の完成度が高いウインドウリサイズアプリ「Magnet」
Macで複数ディスプレイを使っている場合に便利な設定集
AppCleanerでMacアプリを関連ファイルごと完全に削除する
操作に没頭できる!Firefox版 Arcのようなブラウザ「Zen Browser」
chezmoi(シェモア)で始めるdotfiles管理
GitHubの通知を見逃さない!通知に特化したアプリ「Gitify」
Keyboard Maestroの変数基礎
Neovimを使い始める最初の一歩として便利な「LazyVim」
ウェブサイトをmacOSアプリとしてラッピングする「Unite Pro」
Keyboard Maestroの「Macro Debugger」で複雑なマクロのデバッグを行う方法