※2022年から技術系の記事は個人ブログに投稿しております。ぜひこちらもご覧ください→yamaday0u Blog
プログラミングスクールやweb公開されているカリキュラムなどで学習しているとき、
手本通りにコードを書いたはずなのにエラーになってしまった!ということがよくありますよね。
そんなときに便利なのがVisual Studio CodeのCompareコマンドをつかったファイル比較です。
個人的にとても感動したので共有します。
実行環境
- macOS Catalina 10.15.7
- Visual Studio Code:1.51.1
ファイル同士を比較
次の画像を見てください。
右が正しいコードで、左がエラーになるコードです。
どこが違うが見つけられますか?
この例では左右で色が違う箇所があるので、慣れている方は割とすぐわかると思いますが、そうでない方にはなかなか難しいと思います。
次にCompareコマンドを使ってファイルを比較するとこのようになります。
いかがでしょうか?
左右のファイルで異なったコードが書かれている行がハイライトされ、異なっている箇所がさらに濃い色でハイライトされています。
ちなみに正解はバッククォート(``)で書くべきところをシングルクォート('')で書いている、でした。
ファイルとクリップボードを比較
Compareコマンドでは、コピーしてクリップボードに保存されているコードとも比較できます。
これにより、手本のコードをコピーして、自分が書いたコードと比較することができます。
Compareコマンドの使い方
Visual Studio Code上で shift + command + Pを押してCompareコマンドを起動します。
「ファイル:アクティブファイルを比較しています…」をクリックすると、比較するファイルを選ぶ画面が出てくるので、比較したいファイルを選ぶと、先程の画像のように比較することができます。
「ファイル:クリップボードとアクティブファイルを比較」をクリックすれば、クリップボードに保存されているコードと比較できます。