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




サイトのPocketに保存された回数や、あとで読まれた回数まで解析できるPocketのパブリッシャーツールの登録方法
常時SSL化の設定をしたのに「保護された通信」が表示されない時はパスにHTTPが残っているのかも?
WordPressのカスタム投稿タイプを追加後、ページは存在しているはずなのに404になる場合の解決方法
Bracket Pair ColorizerでVisual Studio Codeの括弧を色分けして見やすくする
WordPress5.5のサイトマップ機能を無効にする
Nuxt.jsの基本と最初のセットアップ「プロジェクトの作成と起動をするまでの流れ」
PubSubHubbubを利用してWebサイトの更新をリアルタイムに通知しよう
さくらのレンタルサーバで.htaccessが原因で500エラーになってしまう場合のチェックリスト
アクセス解析ツールの定番!!Googleアナリティクスの登録方法
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
Macの基本操作をラクにするために使っているユーティリティアプリ
CSS Nite in Kobe, vol.42「ユーザーの感情に寄り添い、検索エンジンからも評価される「ドリルライティング」実践講座」に参加してきました
Homebrew Caskを使ってアプリケーションをコマンド一発でインストールできるようにする
Sketchの整列をショートカットキーを使ってすばやく行えるようにする方法
macのFinderで不可視ファイルを見れるようにする幾つかの方法
Keyboard Maestroの「Click at Found Image」で画像と一致する場所をクリックするマクロの作り方
Post Snippetsを使ってWordPressでショートコードをの登録と管理をもっと楽に!!
FigmaのAuto Layout入門|繰り返しのレイアウトやコンテンツに応じて横幅可変するボタンをラクに作る
macOSで画面を拡大縮小するズーム機能の設定