There is a specific kind of dread that hits when you run git merge and see the words “CONFLICT (content): Merge conflict in…” flashing in your terminal. For a long time, I handled this by manually hunting for those awkward <<<<<<< and ======= markers in my text, which felt like searching for a needle in a haystack of code.

However, learning how to fix git merge conflicts in VS Code changed my entire workflow. Modern VS Code has a sophisticated 3-way merge editor that turns a stressful manual process into a visual selection task. In this guide, I'll walk you through the exact process I use to resolve conflicts without accidentally deleting my teammate's hard work.

Prerequisites

Step-by-Step: Resolving Merge Conflicts

Step 1: Trigger the Conflict

Conflicts happen when Git can't automatically decide which change to keep. Usually, this happens during a merge or a pull. Try merging a feature branch into your main branch:

git checkout main
git merge feature-branch

Once you see the conflict warning in the terminal, VS Code will highlight the conflicted files in the Source Control tab (the branch icon on the left sidebar) with a red 'C' next to the filename.

Step 2: Choosing Your Resolution Method

When you open a conflicted file, VS Code offers two ways to handle the fix. In my experience, the traditional inline markers are faster for tiny changes, but the 3-way Merge Editor is a lifesaver for complex logic changes.

Method A: Using Inline Markers

You will see the conflict highlighted in colors (usually blue and green). Above the highlighted block, VS Code provides clickable shortcuts:

Method B: The 3-Way Merge Editor

For larger conflicts, click the "Resolve in Merge Editor" button at the bottom right of the editor window. This opens a specialized view where you see:

As shown in the image below, you can check the boxes for the specific changes you want to keep from either side, and the result pane updates in real-time. This prevents the common mistake of deleting a necessary bracket or semicolon during a manual edit.

Step 3: Finalizing the Fix

Once you have resolved all conflicts in the file, you must tell Git that the conflict is settled. I always double-check the file for any remaining markers before proceeding.

# Stage the resolved file
git add .

Now, complete the merge by committing the changes:

git commit -m "chore: resolve merge conflicts in [file name]"

Pro Tips for Smoother Merges

To avoid spending hours fixing conflicts, I've adopted a few habits that drastically reduce their frequency:

Troubleshooting Common Issues

What if I mess up the resolution?

If you realize you accepted the wrong change and the code is broken, don't panic. You can abort the entire merge and start over with:

git merge --abort

Conflict markers aren't showing up?

Ensure you have the git.mergeEditor setting enabled in VS Code. Go to Settings $\rightarrow$ search for Merge Editor $\rightarrow$ ensure Git: Merge Editor is checked.

I renamed a file, and now everything is a conflict!

This is a common headache. If you've had to rename git branches locally and remotely or rename files across branches, Git might lose track of the history. Try using git merge -X rename-threshold=20% to help Git recognize renamed files.

How to Fix Git Merge Conflicts in VS Code: What's Next?

Now that you know how to fix git merge conflicts in VS Code, you should look into Git Rebase. While merging creates a merge commit, rebasing rewrites history for a cleaner linear timeline. It's a bit more advanced but essential for professional workflows.

Ready to level up your workflow? Explore our other development guides to automate your environment and boost your productivity.

Official resources for Fix Git Merge Conflicts

Documentation and references for Fix Git Merge Conflicts: