VS Code Meetup #21 - もう一度知りたい基礎編 - ファイル操作、コーディングの基本編

Videoの操作一覧のスライド https://www.youtube.com/watch?v=lHwAOT1M-tE

Transcript

1. Atsushi Morimoto @74th
   ● AIよりのフルスタックエンジニア
   ● VS Code Meetup オーガナイザ
   ● 自作キーボードに2年くらいはまっている
   ● 著書
   技術書典3~12参加
   1
   Sparrow62 v2(遊舎工房で委託中）
   

   View Slide

2. 紹介するテクニック
   - 準備
   - ワークスペーストラストの管理で、vscode-book-typescript を消す
   - スクリーンキャストモードを ON
   - ファイル操作
   - ワークスペース、フォルダをドロップで開く
   - ワークスペーストラスト → 信頼する
   - 上位ディレクトリ単位でも指定できるよ
   - ファイルの開き方
   - (New) ツリーへのフィルタ
   - 新規ファイル
   - コマンドパレット
   - ファイル名 (Windows: Ctrl+P、macOS: Cmd+P)
   - シンボル検索 (Windows: Ctrl+T、macOS: Cmd+T)
   2
   

   View Slide

3. 紹介するテクニック
   - タブのファイルの状態
   - 一時的に開いた状態: 斜体 → 一時的ではないようにしたいときはダブルクリック or Ctrl+S 、Cmd+S で保存
   - 未保存の状態: 丸印
   - エラーがある: 赤色
   - git の状態: U(untracked), M(modify) とか文字とか色
   - タブの分割はドラッグ＆ドロップが楽
   - ファイルツリー
   - 設定 files.exclude で node_modules を非表示に
   - 検索 search.exclude も同様に利用できる
   3
   

   View Slide

4. 紹介するテクニック
   - エディタ
   - 定義を開く（Windows/Linux: Ctrl、macOS: Cmd + クリック) or F12
   - 参照しているところ開く
   - 戻る (Windows: Ctrl+-)
   - リネーム (F2)
   - シンボル検索 (Windows: Ctrl+T、macOS: Cmd+T)
   - アウトライン
   - パンくずリスト
   - 問題パネル
   - コンパイルエラー
   - クイックフィックス (💡 マーク)
   4
   

   View Slide

5. 紹介するテクニック
   - よく使うテクニック
   - なんか変な挙動すると思ったら、コマンド「ウィンドウの再読み込み（Reload Windows）」
   - 2 つのファイルをクリックして、ファイルの比較
   - 選択範囲の一括置換 → ファイル内検索の「選択範囲を検索」
   - ファイルパスの取得 → エクスプローラービューでファイルを右クリックして「パスのコピー」、もしくは Shift 押しながらドロップ
   - コマンド「無題の新規ファイル（Untitled File）」
   5
   

   View Slide