Skip to content

git-vscode.md

Latest commit

 

History

History
630 lines (429 loc) · 20.2 KB

git-vscode.md

File metadata and controls

630 lines (429 loc) · 20.2 KB

Git in VS Code

Table of contents

What is Git in VS Code

VS Code has built-in Git support and can be extended with GitLens for advanced operations. This page covers common Git workflows in VS Code, including cloning, branching, committing, and pushing.

Docs:

Clone the repository

Note

See <repo-url>, <repo-name>.

Clone the repository using the VS Code Terminal

  1. To clone the repository,

    run in the VS Code Terminal:

    git clone <repo-url> <repo-path>

    Replace:

    • <repo-url>
    • <repo-path> with the path where you want to clone the repository

    Example:

    git clone https://github.com/microsoft/vscode ~/vscode

    See Home directory (~).

    Troubleshooting

    git asks for a password

    fatal: destination path <directory-path> already exists and is not an empty directory.

  2. To verify that the repository isn't empty,

    run in the VS Code Terminal:

    ls <repo-path>

    The output should be the list of names of files in the repository.

    Example:

    ls ~/vscode

Clone the repository using the Command Palette

  1. Run using the Command Palette: Git: Clone.
  2. Click Clone from GitHub.
  3. Allow the extension to sign in.
  4. Paste the <repo-url>.
  5. Select the repo.
  6. Choose a directory where to clone the repository.
  7. Confirm the choice.

Switch to the <branch>

Switch to the <branch> using the VS Code Terminal

  1. To switch to the <branch>,

    run in the VS Code Terminal:

    git switch <branch>

    Replace the placeholder <branch>.

    Example:

    git switch main

Switch to the <branch> using GitLens

  1. Run using the Command Palette: GitLens: Git Switch to...
  2. Select the <branch>.

Switch to a new branch

Switch to a new branch using GitHub

  1. Go to the repo.

  2. Create a branch.

  3. Copy the command provided by GitHub.

    It looks like this:

    git fetch origin
git checkout <branch>

    Replace <branch>.

  4. Run the copied command using the VS Code Terminal.

Switch to a new branch using the VS Code Terminal

  1. To create and switch to a new branch,

    run in the VS Code Terminal:

    git checkout -b <branch>

    Replace <branch>.

Switch to a new branch using GitLens

  1. Run using the Command Palette: GitLens: Git Create Branch....
  2. Select main as the base branch.
  3. Write the new branch name (let it be <branch>).
  4. Press Enter to confirm.
  5. Select Create & Switch to Branch.

Fetch the latest changes using the VS Code Terminal

  1. Switch to the <branch>.

  2. To fetch the latest changes from <remote>,

    run in the VS Code Terminal:

    git fetch <remote> <branch>

    Replace the placeholders:

    Example:

    git fetch origin main

Detect conflicts

It can happen that commits in <branch> on <remote> are different from commits on the <branch> in the cloned repo on your computer.

Detect conflicts using the VS Code Terminal

  1. Fetch the latest changes using the VS Code Terminal.

  2. To compare the local <branch> with the <branch> on <remote>,

    run in the VS Code Terminal:

    git status

    If the output contains Your branch is behind, Your branch is ahead, or have diverged, there are differences between the local and remote branches.

Detect conflicts using GitLens

  1. Look at the Status Bar.

    Commit Conflict

    You should see that there is a non-zero number of commits to pull from <branch> on <remote>.

Hard reset the <branch>

Note

This operation will make your local <branch> match the <branch> on <remote>.

Caution

This operation discards all uncommitted changes and local commits that are not on the <remote>.

  1. Fetch the latest changes.

  2. To hard reset the local <branch>,

    run in the VS Code Terminal:

    git reset --hard <remote>/<branch>

    Replace the placeholders:

    Example:

    git reset --hard origin/main

Resolve a merge conflict

Resolve a merge conflict.

Resolve a merge conflict using VS Code

VS Code has a built-in merge conflict editor.

  1. Open a file with conflicts.

  2. Use the inline options that appear above the conflict markers:

    • Accept Current Change — keep your branch's version.
    • Accept Incoming Change — keep the other branch's version.
    • Accept Both Changes — keep both versions.

  3. Save the file.

  4. To stage the resolved file,

    run in the VS Code Terminal:

    git add <file-path>

  5. To continue the merge,

    run in the VS Code Terminal:

    git merge --continue

Docs:

Resolve a merge conflict using GitLens

If you see a pull error like the one below, resolve the conflicts:

Pull Error

For each conflicting file, complete the following steps:

  1. Open the Source Control.
  2. Go to Merge Changes.
  3. Click a conflicting file.
  4. Click Resolve in Merge Editor.
  5. Accept the changes that you want to keep.
  6. Click Complete Merge.
  7. Open the Source Control.
  8. Click Continue.

Note

If there are more conflicts, VS Code shows Merging (1/3) or Rebasing (1/3) (or similar). Repeat the steps above for each remaining conflict.

Resolve a merge conflict using the VS Code Terminal

  1. To see which files have conflicts,

    run in the VS Code Terminal:

    git status

    Files with conflicts are listed under Unmerged paths.

  2. Open each conflicted file.

  3. Find the conflict markers (<<<<<<<, =======, >>>>>>>).

  4. Edit the file to keep the correct content.

  5. Remove all conflict markers from the file.

  6. To stage the resolved file,

    run in the VS Code Terminal:

    git add <file-path>

  7. To continue the merge,

    run in the VS Code Terminal:

    git merge --continue

Pull changes from the <branch> on <remote>

Note

See <branch>, <remote>.

Pull changes from <branch> on <remote> using the VS Code Terminal

  1. To pull changes from <branch> on <remote>,

    run in the VS Code Terminal:

    git pull <remote> <branch>

    Example:

    git pull origin main

Pull changes from <branch> on <remote> using GitLens

  1. Run using the Command Palette: GitLens: Pull.

Pull changes from <branch> on <remote> and rebase

Pull and rebase using the VS Code Terminal

  1. To pull changes from <branch> on <remote> and rebase onto it,

    run in the VS Code Terminal:

    git pull --rebase <remote> <branch>

    Example:

    git pull --rebase origin main

    Troubleshooting

    git asks for a password

Pull and rebase using GitLens

  1. Run using the Command Palette: GitLens: Pull.
  2. Select Pull with Rebase.
  3. If GitLens does not show any error, the rebase is complete.

Stage changes using the Source Control

Stage all changes in a specific file

  1. Open the Source Control.
  2. Go to Changes.
  3. Hover over the file name.
  4. Click the + icon next to the file name.

Stage all changes in specific files

  1. Open the Source Control.
  2. Go to Changes.
  3. Select multiple files by holding Ctrl and clicking each file.
  4. Right mouse click the selected files.
  5. Click Stage Changes.

Stage specific changes in a specific file

  1. Open the Source Control.
  2. Go to Changes.
  3. Click a file to open it.
  4. Select changed lines in the editor (red-green).
  5. Right mouse click the selected lines.
  6. Click Stage Selected Ranges.

Unstage specific changes

  1. Open the Source Control.
  2. Go to Staged Changes.
  3. Click a file.
  4. Select changed lines in the editor (red-green).
  5. Right mouse click the selected lines.
  6. Click Unstage Selected Ranges.

Commit changes

Note

Commit message format is: type: short description

Common types:

  • fix: — bug fixes
  • feat: — additions (e.g., new feature)
  • docs: — documentation changes

Commit using the VS Code Terminal

  1. Open the VS Code Terminal.

  2. To stage your changes,

    run in the VS Code Terminal:

    git add <file-path>

    See <file-path>.

    Example:

    git add README.md

    Example (path with spaces):

    git add 'path/some image.svg'

  3. To commit your changes,

    run in the VS Code Terminal:

    git commit -m '<type>: <short description>'

    Example:

    git commit -m 'docs: add architecture diagram'

Commit using Source Control

  1. Stage changes using the Source Control.
  2. Commit staged changes.

Commit staged changes

  1. Open the Source Control.
  2. Write a commit message.
  3. Click Commit.

Undo commits

Note

There can appear a merge conflict when you try to undo.

Undo commits using the VS Code Terminal

  1. To undo the last commit and keep the changes staged,

    run in the VS Code Terminal:

    git reset --soft HEAD~1

    Your changes are staged now.

  2. To stage more changes,

    run in the VS Code Terminal:

    git add some-file

  3. To commit using the previous message,

    run in the VS Code Terminal:

    git commit -C ORIG_HEAD

Undo commits using GitLens

See Undo commit on the current branch.

Publish the branch

Publish using the VS Code Terminal

  1. To publish the branch to origin,

    run in the VS Code Terminal:

    git push -u origin <branch>

Publish using GitLens

  1. Open the Source Control.
  2. Click GITLENS to open the GitLens panel.
  3. Click the Commits icon.
  4. Click the Publish Branch icon to the right of Publish <branch> to GitHub.
  5. Press Enter to confirm.

Push more commits

Push using the VS Code Terminal

  1. To push commits to the remote,

    run in the VS Code Terminal:

    git push

Push using GitLens

  1. Open the Source Control.
  2. Click GITLENS.
  3. Click the Commits icon.
  4. Click the Push icon to the right of COMMITS.