目次
実務での使用頻度が高いショートカット
スクロールできます
| 操作 | Windows | macOS |
|---|---|---|
| 定義へジャンプ | F12 / Ctrl + クリック | F12 / Cmd + クリック |
| 定義をその場でプレビュー | Alt + F12 | Option + F12 |
| 参照一覧を表示 | Shift + F12 | Shift + F12 |
| 行削除 | Ctrl + Shift + K | Cmd + Shift + K |
| クイックオープン(ファイル検索) | Ctrl + P | Cmd + P |
| 行を複製する | Shift + Alt + ↑ / ↓ | Shift + Option + ↑ / ↓ |
| 次の一致箇所を選択 | Ctrl + D | Cmd + D |
| すべて折りたたむ | Cmd + K → Cmd + 0 | Cmd + K → Cmd + 0 |
| ファイル内のシンボル検索 | Ctrl + Shift + O | Cmd + Shift + O |
| シンボルの一括リネーム | F2 | F2 |
| ドキュメントの自動整形 | Shift + Alt + F | Shift + Option + F |
- 同じ列の複数行に対して同時に入力したい場合
Ctrl + Alt + ↑/↓(macOSはCmd + Option + ↑/↓)を使う。こちらはカーソルを縦方向に追加する操作で、揃った位置に同じ文字列を一括で挿入したいとき(配列の各要素にカンマを足す、複数行にセミコロンを追加するなど)に向いている。
任意の位置に自由にカーソルを追加したい場合はAlt + クリック(macOSはOption + クリック)を使う。列を揃える必要がなく、クリックした場所すべてにカーソルが立つため、バラバラの位置を同時に編集したいときに向いている。
- すべて折りたたむ
Ctrl+K Ctrl+0全て折りたたまれており一つずつ展開して使用すると素早く作業できます
- 何の閉じタグかを分かりやすくする方法
タグ名.クラス名|c
デバッグ実行に関する操作は以下の通り
スクロールできます
| 操作 | Windows | macOS |
|---|---|---|
| デバッグ開始/継続 | F5 | F5 |
| ステップオーバー 現在の行を実行するが、 その行が関数呼び出しなら関数の中には入らず、 呼び出し結果だけ受け取って次の行に進む。 | F10 | F10 |
| ステップイン 現在の行が関数呼び出しなら、その関数の中に入って1行ずつ追う | F11 | F11 |
| ステップアウト 今いる関数の残りを一気に実行し、呼び出し元の場所まで戻る。 | Shift + F11 | Shift + F11 |
おすすめ拡張機能
CSS Peek
cssでどのようなスタイルが効いているか、「ホバー」もしくは「右クリックで定義」確認ができます
