HomeTutorsContact

How to diff two files in Visual Studio Code(VSCode)?

By Gulshan Saini
Published in VSCode
June 14, 2020
1 min read

Suppose we have below two files that we want to compare inside VSCode.

index.html

<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Home Page</title>
  </head>
  <body></body>
</html>

index-old.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Home Page</title>
  </head>
  <body></body>
</html>

Step 1

Open file explorer as shown in the image below.

VSCode file explorer
VSCode file explorer

Step 2

Next, right click on the file you want to compare click Select for Compare

Select file for comparison - VSCode file explorer
Select file for comparison - VSCode file explorer

Step 3

In this step, we will select the file with which we want the comparison.

right click on the file click Compare with Selected

Select second file for comparison - VSCode file explorer
Select second file for comparison - VSCode file explorer

Result

VSCode display highlights the differences between two files as we can see in the screenshot below.

VSCode two file comparison result
VSCode two file comparison result

Tip: If you are on OSX you can navigate to directory and type command diff index.html index-old.html


Tags

#vscode#shortcut
Previous Article
How to open the integrated terminal in Visual Studio Code(VSCode)?

Related Posts

VSCode
How to open Visual Studio Code(VSCode) from terminal?
July 24, 2020
1 min
Gulshan Saini

Gulshan Saini

Fullstack Developer

Topics

Flutter
JavaScript
NextJS
ReactJS
Typescript

Subscribe to our newsletter!

We'll send you the best of our blog just once a month. We promise.
© 2021, All Rights Reserved.

Quick Links

Contact UsBrowserCSSPythonPuppeteer

Social Media