べんりワザ・VSCode を速く使う

検索と置換でまとめて直す

「あの単語どこだっけ?」を一瞬で。さらに、同じ言葉をファイル中・フォルダ中でまとめて置きかえる置換まで。手で1つずつ直す時間を、まるごと節約できます。

コードが長くなってくると、「さっき書いたあの文、どこだっけ?」と探し回る時間が増えてきます。さらに「この名前、ぜんぶ別の名前に変えたい」なんてときに、上から目で追って1つずつ直すのは大変。そこで使うのが 検索(さがす)置換(おきかえる) です。

まずは「さがす」— ⌘ + F / Ctrl + F

⌘ + F を押すと、右上に小さな検索ボックスが出ます。ここに探したい言葉を打つと、その言葉がぜんぶ光って、いくつ見つかったかも出ます。Enter を押すたびに、次の場所へ順番にジャンプできます。

長いコードの中から「あのクラス名」「あの文字」を目で探す必要が、もうありません。

検索ボックスの右にある3つのアイコン

検索ボックスの右はしに、小さなアイコンが3つ並んでいます。押すとON/OFFが切り替わり、探し方を絞りこめます。

アイコン名前できること
Aa大文字・小文字を区別ONにするとBoxboxを別物として扱う
ab|単語単位で検索ONにするとboxにヒットしてinboxにはヒットしなくなる
.*正規表現を使うパターンで検索できる(例:\d+で数字だけを探す)

ふだんはOFFのままで十分ですが、「boxだけ探したいのにtoolboxまで光ってしまう」ときは単語単位で検索をONにすると狙った場所だけに絞れます。

つづけて「おきかえる」— ⌘ + ⌥ + F / Ctrl + H

検索ボックスの左にある小さな「>(矢印)」を押すと、下にもう1つの入力欄が開きます。ここが置きかえ先。

  • 上の欄:さがす言葉(例:box
  • 下の欄:新しい言葉(例:card

置きかえには2つのボタンがあります。

ボタンはたらき
1つずつ置換見つかった1か所だけを置きかえる(確認しながら)
すべて置換見つかった場所をいっぺんに置きかえる

たとえば box という名前を全部 card に変えたいとき、「すべて置換」を1回押すだけで完了します。

フォルダ全体からさがす(全文検索)

「どのファイルに書いたか思い出せない!」——そんなときは、左のバーにある虫めがねアイコン(Search)。⌘ + ⇧ + F(Winは Ctrl + Shift + F)でも開きます。

ここで言葉を打つと、開いているフォルダの中のぜんぶのファイルから一気にさがしてくれます。どのファイルの何行目にあるかまで並ぶので、大きくなったサイトでも迷子になりません。もちろん、ここでもフォルダまるごと置換ができます。

「探す」だけでも毎日すごく役に立つよ。まず ⌘F(Ctrl+F)だけ手になじませて、置きかえは必要になったとき思い出せば大丈夫〜

まとめ

  1. ⌘ / Ctrl + F で、今のファイルの中の言葉を光らせて探せる
  2. 単語単位で検索をONにすれば、狙った言葉だけに絞りこめる
  3. 置換を使えば、同じ言葉をまとめて別の言葉へ変えられる
  4. ⌘ / Ctrl + ⇧ + F の全文検索なら、フォルダ中のファイルから一気に探せる

探す・直すが速くなると、コードが増えても怖くなくなります。