僕の考えた最強のvscodeチートシート
いろんな人が書いているチートシートにこんな不満はありませんか？
- windows（またはmac）のキーしか書いてない
- あっちの人の記事にはあれが書いてあるけど、これには書いてない
- 俺キーバインド変えてるし…
- もっとマニアックなコマンド教えろ
それらを解決すべく、カスタマイズ可能なチートシートを作りました。
成果物
https://optimistic-khorana-d23568.netlify.com/
以下各フォームについて解説します。
フォームの入力内容はlocalstorageに保存
各フォームの入力内容はlocalstorageに保存しているので、再アクセス時に前の入力値が保たれます。
自分のkeybinding.jsonでアップデートできる
このチートシートは「デフォルトjson」の部分に貼り付けたkeybinding.jsonを読み込んで、各コマンドに僕が考えたコメントを割り振ること作成されます。
フォームに何も入力されていない場合、keybinding.jsonは拡張機能を切った僕のwindowsとmacのPCのkeybinding.jsonが適用されます。ユーザーエージェントから判別してmacの場合は、macのkeybinding.jsonが。それ以外はwindowsのkeybinding.jsonが適用されます。（linuxはわからなかったのでごめんなさい）
拡張機能でコマンドが変わっている人は特に忘れずに自分のdefaultのjsonを「デフォルトjson」の欄に貼り付けてください。
また、自分でカスタマイズしたjsonの方はカスタムjsonの方に貼り付けてください。
stripJsonCommentsを使用しているので、jsonにコメントが入っていても問題ありません。
なお自分のjsonで起こったので注意です。下記のようなコードを貼り付ける際、気をつけてください。'hogehoge'の後ろの「,」を取り除かないとJSONのパースに失敗します。（vscode上では問題なく動く模様。）
command:'hogehoge',
}
キーバインド置換設定
keyの項目の文字列を置換します。windoswでは「oem_〇〇」。macでは「[〇〇]」のような文字列がキーボード配列によって指すキーが違ったりしているので、自分のパソコンのキーバインドを参考にデフォルト値を決定しています。
また、alt,cmd,shift,ctrlはmacでは記号がデフォルト値に入るようにしてあります。
キーボード配列で変わるものではありませんが、escape等も別の表示ができるようにしてあります。
僕はWindowsでこんな風に変えてます。
alt→Alt
ctrl→Ctrl
escape→ESC
backspace→Back
home→Fn+right (ファンクションキーがないと押せないので)
end→Fn+left
pageup→Fn+up
pagedown→Fn+down
commandとwhenでフィルター
このチートシートはjsonから作り出した配列に対してcommandとwhenの値にフィルターをかけて作成しています。
スペースで複数のワードをフィルターに使えます。
「hoge moge」と入力した場合「hogeかつmogeを含む」フィルターになります。(hogeまたはmogeにはならないので注意)
単語の先頭に「-」をつけることで、単語を除外できます。「hoge -moge」では「hogeを含み
、mogeを含まない」フィルターになります。
常に表示するコマンド
「常に表示する」欄に入力したコマンドはフィルターで除外されない他、元のキーバインドのjsonに載っていない場合、key欄とwhen欄を空にして表示させます。
プリセット
上記のフォームに入力した値は名前をつけてプリセットとして登録できます。
プリセットはlocal storageに保存するので、再読込しても問題ありません。
デフォルトプリセット
最初から設置してあるプリセットはカスタマイズ不可能です。
マニアックなキーバインドを把握したかったのも動機の一つなので、わざわざ書かなくていいようなマニアックな操作も載ってます。
後々もっと使いやすいデフォルトプリセットを用意して切り替えられるような仕組みにしたいです。
作るのに使ったもの
- vuejs
- vuetify
templateはpugで書いています。もうpugしか書きたくない。
ソースコード
ソースコードか？欲しけりゃくれてやるぜ・・・ 探してみろ。このサイトのすべてをそこに置いてきた！
https://github.com/tempakyousuke/vscode-cheatsheet
by TEMPA・D・KYOUSUKE
※ ネタがわからない人ごめんなさい
課題や感想
- 割と中途半端な状態で発表した自覚があります。
- マサカリが怖い。
- デフォルトプリセットはまだまだ見直し・追加予定。
- 選んだプリセットでユーザーにキーを打ち込ませるトレーニングゲームとかできたらいいなとか思ってます。
追記予定
- ちょっとまだまだ修正する点が多いサイトですが、落ち着いたら製作途中で溜まったvscodeの知見書きます。