V)S Code has Git Version Control built into the editor when you install it. You can also install other source control systems from the marketplace.
Other Version Control System Integrations for VS Code
- Mercurial – here
- Preforce – here
- SVN – here
- Team Server Foundation – here
- Note: you must have Team Foundation Server 2015 Update 2 or later
Entire list of SVM Marketplace Extensions or while in VS Code type Install Additional SCM Providers
Let’s take a look specifically at the Git support VS Code offers.
This article will assume you have basic knowledge of Git, if not feel free to checkout GitHub’s Git Tutorial here. It allows you to become familiar with Git and Git commands without needing to download anything – it’s all done right in the browser!
This also assumes you have already installed the Git client (grab it from here).
Let’s dive in!
Features in the activity bar
Remeber the Activity bar we saw in Navigating VS Code the Source control icon (
Ctrl+Shift+G). This feature will display an overview of the changes made to your repository. You will be able to view the details like changes, staged changes, and merge changes.
Clicking on any of these will provide further details on the changes.
Features in the status bar
Remeber the Status bar we saw in Navigating VS Code – well here we can also see details regarding the status of our repository changes. We can view our current branch, your modified tracked files and staged changes, along with commits.
The status bar allows us to switch between branches or even create a new branch on the fly.
There is also the Synchronize changes action in the Status Bar. When there is an available upstream branch configured you can synchronize with it. You can pull down the remote changes to your local copy and/or push your local changes to the upstream branch. When no upstream is available, then you will have a Publish action available to set up with a remote repository.
... menu on the top of the Git view to see all available actions. These actions include pull, push, commit, stage, etc.
We can quickly go from our changes to stage changes by hovering over the number of files and with the click of the
You can also stage a portion of a file by selecting and then choosing Stage Selected Ranges from the command palette.
Resolve merge conflicts and git diff
During a merge, click the Source Control button in the Activity Bar and make changes in the diff view. Select and accept current, incoming or both changes in just one click.
Differences are highlighted and you are presented with various actions to accept.
Git diff is also supported in VS Code. You can view side by side or inline.
side by side
Clone or initialize repository
To clone a repository, you can run a Git Clone command from the command palette
To initialize a repository, you can run an Initialise Git Repository command from the command palette and the necessary metadata will be created.
Default Git configuration in workspace settings
// Git // Whether auto fetching is enabled "git.autofetch": false, // Whether auto refreshing is enabled "git.autorefresh": true, // Controls what type of branches are listed when running `Checkout to...`. `all` shows all refs, `local` shows only the local branchs, `tags` shows only tags and `remote` shows only remote branches. "git.checkoutType": "all", // Confirm before synchronizing git repositories "git.confirmSync": true, // Controls the git badge counter. `all` counts all changes. `tracked` counts only the tracked changes. `off` turns it off. "git.countBadge": "all", // Controls if Git contributes colors and badges to the explorer and the open editors view. "git.decorations.enabled": true, // The default location where to clone a git repository "git.defaultCloneDirectory": null, // Enables commit signing with GPG. "git.enableCommitSigning": false, // Whether git is enabled "git.enabled": true, // Commit all changes when there are no staged changes. "git.enableSmartCommit": false, // Ignores the legacy Git warning "git.ignoreLegacyWarning": false, // Ignores the warning when there are too many changes in a repository "git.ignoreLimitWarning": false, // Ignores the warning when Git is missing "git.ignoreMissingGitWarning": false, // Path to the git executable "git.path": null,
Multiple source control integrations
VS Code is capable of handling multiple source control integrations across various projects. The source control providers list shows the providers and repos.
That’s it for my overview of using Git with VS Code. Stay tuned for building an extension for VS Code for Day 5!