Use VS Code as Git editor, difftool and mergetool

Lakshmikanth Balasundaram -

Recently, I started using git from command line instead of git UI tools (Visual Studio and JetBrains) and loved it. However, find it difficult to use vim or nano editor to view differences especially during conflict resolution tasks. To manage this, I configured VS Code as default editor for git.

Here are the steps to configure VS Code as your default editor for git.

  • Configure VS Code in your path variable
  • Configure VS Code as your default editor
  • Configure VS Code as your default diff tool
  • Configure VS Code as your default merge tool

Configure VS Code in your path variable

From your terminal window, type the following command

code --version

If code is installed and configured in your path, you will receive successful response. Otherwise, follow the steps below to configure VS code in your path

// edit profile
vi ~/.zshrc

// at the end of the file, add the following line
export PATH="/Applications/Visual Studio Code.app/Contents/Resources/app/bin:$PATH"

// save and exit vi editor

// to load the changes, use the source command
source ~/.zshrc

Configure VS Code in your default editor

To configure git to use code as your default editor, use the following command

git config --global core.editor 'code --wait'

We are using --wait flag so that command returns after the code window is closed.

Configure VS Code in your default diff tool

To configure git to use code as your default diff tool, use the following command

// specify tool name for git diff
git config --global diff.tool vscode


// specify how to run this tool
// we configured tool name as 'vscode' and must match in the below command
git config --global difftool.vscode.cmd 'code --wait --diff $LOCAL $REMOTE'

In the above script, $LOCAL and $REMOTE are placeholders and will be replaced with actual values by git.

Configure VS Code in your default merge tool

To configure git to use code as your default merge tool, use the following command

// specify tool name for git merge
git config --global merge.tool vscode

// specify how to run this tool
// we configured tool name as 'vscode' and must match in the below command
git config --global mergetool.vscode.cmd 'code --wait $MERGED'

In the above script, $MERGED is a placeholder and will be replaced with actual values by git.

Conclusion

To confirm that you have configured correctly, you can use the following command 

git config --global --list

Or you can use the below command to view configuration in VS Code :-)

git config --global -e