How to merge files(differentiate) in visual studio code

Question

I am using Visual studio code for angular2 application. The requirement is to merge files, so, I want to differentiate changes in two files as it happens in Netbeans IDE. Is there, any extensions available to achieve the task in visual studio code.

For e.g - Merging Two files by differentiating changes like below:-

Please suggest some solution.

abc.component.ts (located in project1)

abc          <-- text for understanding purpose
def

abc.component.ts ( located in project2)

abc

I want to differentiate two component files and push changes in another like it happens in Netbeans IDE? Is there, any solution available for Visual studio code?

This has nothing to do with angular. I don't know if there is a function in Visual Studio Code but I recommend you a difftool like meld for Linux or winmerge for Windows. — Thomas Sablik, Nov 30 '17 at 12:42
I assume these merge utilities are similar to classic version control merge utilities? They use 3 files for input, the original file, changed file #1, and changed file #2, and produces a single output file. One implementation is to generate set #1 of batch editor commands to convert the original to file #1, and set #2 of batch editor commands to convert the original to file #2, then merge the edit commands (reporting conflicts if they exist), then use the merged edit commands with a batch editor to produce an output file that includes the combined changes. — rcgldr, Nov 30 '17 at 12:44
Using Linux. Sorry, angular for indicating purpose about project. Yes, It has nothing to do with angular. Is there any solution available like some extensions to differentiate and merge files. — Mahi, Nov 30 '17 at 12:45
Possible duplicate of [In Visual Studio Code How do I merge between two local branches?](https://stackoverflow.com/questions/38648772/in-visual-studio-code-how-do-i-merge-between-two-local-branches) — HackSlash, Oct 01 '19 at 15:31

Mohamed Allal · Accepted Answer · 2020-02-13T22:20:46.173

First using vscode natively with the git toolset

(Make sure to look on the second title as it's a better native way!)

This way may be available on older version of vscode too! Still a good thing to know! (even we should always run on the latest version! And vscode is always keeping getting better and better).

A native powerful and cool way is to use the git toolset within vscode! It still not the most fluid way! But if you are in a setup where you don't have anything else or time or resources to use anything else! Also as a requirement you need to have a git repo initiated! Here we go:

First we will use the change and diffing capability of the git tool set. And the steps go as bellow:

Commit all the current changes
once done: copy past the other file to diff on the place of the current one. And save.
Cool now in the git pallet you can see the file in changes list! Click on it and the diffing editor will show!

Bingo this is it! You can compare and make direct changment! The diffing will keep happening in real time. Note the current state is in the right. And you make changement there.

Here an illustration of direct modification for instance the part in the left is missing from the current file

And here another illustration (current have in plus)

Well to sum up! Git tool and diffing in vscode is so powerful! And all that one need! The only problem is the extra step of committing and cleaning after if desired!

Here some tips! If you want to have the commit history cleaner! Or not have a merge separate! You can remove the last commits from history as much as you need: Without hard reset and commit again a cleaner one!

git reset --soft HEAD~1

You can check How to cancel a local git commit

Otherwise it can be ok with atomic commit and merge mention!

Also if what you need is to be able to keep a lot from the current file! You can copy the current elsewhere! past the other file to compare! commit ! and then past again the old one! You'll have the old in the right and as current (Not as described on the above) In such a scenario this work well! (Hacky a bit but you may need it).

Native way (direct open of the compare editor)

(May require the newer version of vscode)

open a file that you gonna compare

open the command pallet

CTRL + SHIFT + P

type file: compare

You can see the different possible ways! For a file we can choose compare active file with.

Then you choose the file! The file need to be within the project directory.

And then you choose a file and the compare editor will open

The above was tested on my brother computer on a new vscode installation. I wasn't sure at first if it was part of the core! And i just confirmed that it is. That too remove the need to the method above involving git! And it's the best native way to go with.