Most production projects involve a team, so even one file can have multiple collaborators. When things go wrong, it's important to understand how and why certain code changes were made, and by whom.
This is easily done with the powerful Git Blame command in VS Code. You can use it to determine who wrote each line of code in a particular file.
In this post, we'll look at different ways to use the git blan command in VS Code. Multiple commands may be required to check each file. But instead, we can use some awesome extensions in VS Code to implement the same processes and get faster results.
What is Git debt?
Git Blame is a Git version control command. List the authors of each line of code in the file. Here is the syntax:
Blame GitIn the following example, we use Git Blame to find changes made to a file. Note that we need to provide the full path as well as the file name. The author of each line is listed here. We also see that almost all of the changes were made by the user named ankit, but the change in line 16 was made by the user nabendu82.
The above project is a large React.js project with many files. So it will be very difficult to check the different authors of each file from the command line. In the next section, we'll look at better ways to achieve this with VS Code extensions.
Extensiones VS Code Git Blame
As we just saw, manually checking the author on each file from the command line is a lot of work. Instead, we can use four extensions in VS Code that will help us easily find the author of each line of code. Now, most of the extensions in VS Code, like VS Code itself, are free. These extensions are generally small programs that add functionality to VS Code.
We will see the following extensions to add Git Blame to our project:
- git bug
- GitLens
- gypsy story
- gita diagram
git bug
We open our previous project in VS Code. You can open any project, but it's useful when your code has multiple authors. Then we need to click on the "Extension" tab on the left bar. Here, in the input field, search for "guilt" and press Enter.
We will get many extensions, but we click on the firstGit Blame de Wade Andersonand has 1.3 million downloads. Then click the "Install" button to install this extension in VS Code.
After a successful installation, we see thisDeactivateIuninstallKeys.
We don't need to do any other configuration to use this extension. Now we can open any file and click on any line.
To illustrate what this looks like, we open the same Community.js file we checked from the terminal. We clicked on poem 11 and in the bottom bar we see the author of this poem. We will also see what time the commit was made.
Here we clicked on another poem and it turned out to be by another author. Then click on the author's name in the blue bar below.
Clicking on the name will open a popup window with a commit message from Git. There will also be a "View" button, so let's click on it.
This will open the GitHub changes in the browser with the commit details.
GitLens
GitLensis the most popular extension for Git Blame. In fact, it is the most popular VS Code extension with 17 million downloads. We will search for "Git Blame" again.renewaltab and GitLens is the second. This extension was created by GitKraken and the full name is GitLens - Git supercharged.
This extension provides several ways to detect Git errors. It offers basic features for all users as well as advanced features for advanced users.
basic functions
The main way to use GitLens is to click on a line of code whose author needs to know. Displays the author's name along with the approval message and time in light gray text.
If we hover over the gray text, we get more information. Note that the first time we use it, we'll also be prompted to connect to GitHub.
When you click "Connect to GitHub", a popup window will appear. Click Allow.
GitHub then asks us to give it permission in our browser.
Again, GitHub will ask for your permission to open VS Code. Click Allow.
Again, we need to allow access through VS Code.
We finally have access. Now, as soon as we hover over the Git Blame message, we get more details about the commit.
advanced features
We can click on the Git Blame message in the bottom blue bar. This will open a popup window where we can do a lot of things like open a commit in Git or revert a commit.
Here we click on the approval message for more information.
In the sidebar, we see more details about the approval.
Another powerful feature of GitLens is the ability to view file-wide commits. To do this, click the GitLens icon in the upper right corner. A popup window will open, click on itChange the blame for the file.
Now we see the commits of the entire file by different authors.
gypsy story
gypsy storyis a simple VS Code extension that allows us to monitor various git bugs. We look for "Git Blame" again.renewalTab. This is the third extension and has six million downloads. This extension is from Don Jayamamanne.
Once the extension has been successfully installed, right-click on any file. The menu displays two new options for viewing Git changes. Here we click nextGit: Show file history.
This will open all the commits in the file in a new tab. We can click on any of them. Here we click on the first commit.
This will show us all the files that have been modified in this commit at the bottom of the page.
Now we clicked on another commit and then on this oneanteriorbutton in a single confirmation.
This will open your changes in another tab.
We can also see the change in each row by right clicking and then clickingGit: Show line history.Row changes will open in a new tab.
gita diagram
gita diagramis another simple Git Blame extension that displays all Git changes in a graphical format. Again, we look for "Git Blame" in the "Extension" tab. This is the fourth expansion and it has three million downloads. This extension is made by mhutchie.
When the extension is installed correctly, we will see it in a blue bar. We just have to click on it and then all our branches will appear with all the commit messages. Here we clicked on the second confirmation message.
All files updated by this commit will be listed.
Then we click approval, renaming the YouTube link. And then to the only file that changed, Community.js.
Now we can see the changes to this file in split screen.
Diploma
In this post, we talk about what the "Git Blame" command is and the difficulties of using it from the terminal. We also reviewed four Git Blaze extensions in VS Code that make it easy to verify who wrote each line of code.
Of the four Git Blame VS Code extensions, GitLens is the clear winner. It has the most features and is also the most popular.
FAQs
How to use Git blame in Visual Studio Code? ›
We can click on the git blame message on the bottom blue strip. It will open a pop-up in which we can do a lot of things like opening a commit on git or resetting the commit. Here we are clicking on the commit message to get more details. In the sidebar, we will see more details about the commit.
How to use git extensions in VS Code? ›- GitExtensions: Blame current file.
- GitExtensions: Create a branch.
- GitExtensions: Browse repository.
- GitExtensions: Commit.
- GitExtensions: Checkout a branch.
- GitExtensions: Checkout a revision.
- GitExtensions: See in Diff Tool.
- GitExtensions: See File History.
GitHub Repositories extension. The GitHub Repositories extension lets you quickly browse, search, edit, and commit to any remote GitHub repository directly from within Visual Studio Code, without needing to clone the repository locally.
How to resolve git conflicts in VS Code? ›Use the Git Changes window to create a merge commit and resolve the conflict. If you need to keep all of your changes to a file, you can right-click it in the Unmerged Changes section and select Keep Current (Local) without having to open Merge Editor.
How do I enable Git in Visual Studio? ›To configure Git settings in Visual Studio, choose Settings from the top-level Git menu. Choose Git Global Settings or Git Repository Settings to view and configure global-level or repository-level settings. You can configure several common Git settings, as described in the following sections of this article.
What is the Git blame function? ›The git blame command is used to examine the contents of a file line by line and see when each line was last modified and who the author of the modifications was. The output format of git blame can be altered with various command line options.
How to connect Git to Visual Studio? ›In the Visual Studio IDE, select the Git menu, and then select Clone Repository. Follow the prompts to connect to the Git repository that includes the files you're looking for.
How do I configure extensions in VS Code? ›You can browse and install extensions from within VS Code. Bring up the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of VS Code or the View: Extensions command (Ctrl+Shift+X). This will show you a list of the most popular VS Code extensions on the VS Code Marketplace.
How to work with Git extension? ›- To start the process click the 'Commit' icon.
- The respective fields are displayed in the newly opened commit window (Refer figure): Working directory files. ...
- Commit the files using the 'Commit' button. The status of the commit operation is displayed in a dialog window.
Open the command prompt "terminal" and type git version to verify Git was installed.
How to avoid code conflict in Git? ›
- creating branches.
- creating pull requests.
- Avoid allowing pull requests to become stale.
- Make sure you're not changing the same lines of code before merging a prior change.
- Establish and follow formatting rules.
The easiest way to resolve a conflicted file is to open it and make any necessary changes. After editing the file, we can use the git add a command to stage the new merged content. The final step is to create a new commit with the help of the git commit command. Git will create a new merge commit to finalize the merge.
How to resolve conflicts in Git without commit? ›- Step 1: Switch to Git Repository. ...
- Step 2: Generate and Update File. ...
- Step 3: Track File. ...
- Step 4: Push Changes to Git Repository. ...
- Step 5: Update File. ...
- Step 6: Git Stash. ...
- Step 7: Modify Existing File. ...
- Step 8: Staged Add Changes.
- Talk directly. Assuming that there is no threat of physical violence, talk directly to the person with whom you have the problem. ...
- Choose a good time. ...
- Plan ahead. ...
- Don't blame or name-call. ...
- Give information. ...
- Listen. ...
- Show that you are listening. ...
- Talk it all through.
To determine if GIt is installed and detected by the Git extension, click on the Source Control button or press CTRL+SHIFT+G while inside the VS Code window. If Git is not installed or detected, you would see a message, similar to the one below.
Why Git is not working in visual studio code? ›Enable Git in VS Code
Go to Settings. Type Git: Enabled in the search bar. Make sure that the box is ticked.
The "commit" command is used to save your changes to the local repository. Note that you have to explicitly tell Git which changes you want to include in a commit before running the "git commit" command. This means that a file won't be automatically included in the next commit just because it was changed.
How do I see blame on GitHub? ›On GitHub.com, navigate to the main page of the repository. Click to open the file whose line history you want to view. Above the file content, click Blame. This view gives you a line-by-line revision history, with the code in a file separated by commit.
What is blame in source control? ›Git blame is the command that can tell you who was the last person to modify each line of code and when.
What is raw and blame in GitHub? ›The Raw button, like the name suggests, opens the file in a raw form, meaning that any HTML formatting disappears. This is particularly useful when you want to download a single file.
Does Visual Studio have Git integration? ›
Seamless integration with GitHub
Authenticate your GitHub.com or GitHub enterprise account to create a repository, and push your first commits to GitHub, all through Visual Studio.
While in Visual Studio, open a command prompt in your repo from Team Explorer's Connect view. Right-click your local repo and select Open Command Prompt. Some commands require having specific Git permissions in Azure Repos to complete.
How do I manage extensions in Visual Studio? ›To open the Manage Extensions dialog, choose Extensions > Manage Extensions. Or, type Extensions in the search box and choose Manage Extensions. The pane on the left categorizes extensions by those that are installed, those available on Visual Studio Marketplace (Online), and those that have updates available.
How do I enable workspace extensions in VS Code? ›Open a new workspace / folder. Disable all extensions using Disable . Enable all extension that you want to have enabled in every new project with Enable . Enable extensions that you only want to use in this particular workspace / folder with Enable (Workspace)
How do you debug extensions for VS Code? ›Debugging the extension
VS Code's built-in debugging functionality makes it easy to debug extensions. Set a breakpoint by clicking the gutter next to a line, and VS Code will hit the breakpoint. You can hover over variables in the editor or use the Run and Debug view in the left to check a variable's value.
Git GUI is part of the Git installation, along with Git Bash. Git Extensions is built on top of Git. Please provide additional details to your problem.
How to connect to Git through command line? ›- Step 1: Get SSH Access. Connect to your server via SSH. ...
- Step 2: Generate SSH Key (Master Credentials Only) ...
- Step 3: Upload the SSH Public Key to Your Git Repository. ...
- Step 4: Deploy Code Using Git Commands.
- In VS Code, in the Activity Bar, click the Remote Explorer icon. ...
- Select "GitHub Codespaces" from the dropdown at the top of the "Remote Explorer" side bar, if it is not already selected.
- Click Sign in to GitHub.
- If you are not currently signed in to GitHub you'll be prompted to do so.
Select one of your repositories, and then select the repository location, which must be a folder. Once you choose the folder, you click the Select Repository Location button. After this, we need to set the Git username and email address with the git config command on the terminal.
How to connect Git to GitHub to Visual Studio? ›In Visual Studio, select Team Explorer from the View menu. In the Team Explorer pane, click the Manage Connections toolbar icon. Click the Connect link in the GitHub section. If none of these options are visible, click Manage Connections and then Connect to GitHub.
How to check git status in visual studio? ›
Visual Studio displays the current branch in the selector at the top of the Git Changes window. The current branch is also available in the status bar on the bottom-right corner of the Visual Studio IDE. From both locations, you can switch between existing branches.
Where is git usually installed? ›The default path is “C:\Program Files\Git“. If you want the software installed in a different location click Browse and specify a different folder.
Where do I run my git commands? ›For one, the command line is the only place you can run all Git commands — most of the GUIs implement only a partial subset of Git functionality for simplicity.
How to use Git in Visual Studio Code terminal? ›- Select the source control icon located on the activity bar.
- Then select Clone Repository.
- Navigate to your preferred repository hosting service, like GitHub.
- Navigate to the search bar at the top left corner, search for your desired remote repository, and select the repo.
The git blame command is used to examine the contents of a file line by line and see when each line was last modified and who the author of the modifications was.
How to connect Git with Visual Studio? ›In the Visual Studio IDE, select the Git menu, and then select Clone Repository. Follow the prompts to connect to the Git repository that includes the files you're looking for.
How to run Git commands in terminal? ›For Windows, when installing Git through the installer, it is recommended you select the “Use Git from the Windows Command Prompt” option. This will allow you to use all git commands through your terminal (CMD, PowerShell, Anaconda) rather than having to use Git's personal terminal, Git Bash.
What is the need to assign blame? ›Assigning blame allows the blamer to avoid taking any responsibility for their own actions and say the conflict is entirely the responsibility of the other person. However, conflict is rarely found to be the fault of solely one person. Blame does not change the argument or the facts of the situation.
Why do we assign blame? ›We blame others to dispose of problems and protect our sense of self-worth when things go bad. We take credit ourselves to enhance our sense of self-worth when things go well.
How does blaming work? ›Blaming is simply the act of assigning responsibility for something that happened. However, it's usually a negative act – you blame someone for breaking your favorite coffee mug, but you rarely blame someone for mowing the lawn, for instance.