Home > Development Tools > VSCode > A thorough understanding of the configuration and use of git in VSCode in one article

A thorough understanding of the configuration and use of git in VSCode in one article

青灯夜游
Release: 2022-08-30 20:33:18
forward
4098 people have browsed it

This article will talk about the VSCode Git operation and introduce the related configuration and use of git in VSCode. I hope it will be helpful to everyone!

A thorough understanding of the configuration and use of git in VSCode in one article

(The operations in this article are all performed on Gitee. The operation methods of Gitee and Github are basically the same.)

1. Build a Git environment (Windows)

1. First download and install Git, and then register your Git username and email. This step is as follows The article has already been described and will not be repeated here;

https://blog.csdn.net/weixin_53072519/article/details/122824860

Introduces the use of GIT in detail, including GIT introduction, installation, related command explanations, and uploading projects to the cloud and cloning them locally.

【Recommended study: "vscode introductory tutorial"】

2 . Generate SSH public key and secret key;

Right-click to open Git Bash Here;

Use command ls .ssh Check whether there is already a public key and a private key in our directory (the following is not available);

Create the public key and private key, use the command ssh-keygen -t rsa -C "mailbox"

At this point the public and private keys have been generated, pay attention to the path prompted;

3. Add the public key to GitHub/Gitee;

Copy the public key;

##Enter Gitee --> "Settings" --> "SSH Public Key", add a new public key;

After successful addition, the following is as follows;

4. Test the SSH connection;

Use the command

ssh -T git@gitee.com to test, and hi... . means the connection is successful;

Also use the command

ssh -T git@github.com when using Github;

2. GIt related operations in VS Code

(Here I will use an empty folder git as the project File to perform related demonstration operations.)

Local class operations

1. Preparation Project file and initialize the warehouse

Create a new project folder git as a project; enter Git Bash Here on the desktop, enter the command code git and use vs code to open our project folder;

Enter source code management in vs code and click Initialize the repository. This step also completes the initialization of the git warehouse. At this time, you can see that the folder already has a .git folder (hidden by default, you need to set up to show hidden files to see);

Then create a new file demo.html in the project file git;

At this time we can see that the newly created file is Green, with a U prompt behind it; U means Untracked, which means that this file is currently only in our local area and is not tracked by git.

2. Add files to the temporary storage area

Enter source code management and click the # behind the file you want to operate. ##" ", you can add the file to the temporary storage area, which is equivalent to executing the command git add;

The file name is still green at this time , but the U behind it becomes A, and A means that the file is already in the temporary storage area.

3. Submit the files in the temporary storage area to the git warehouse

Submit the files in the temporary storage area to git, Enter source code management, enter relevant remarks in the message box, and then click

"√" to submit once, or use the Ctrl Enter shortcut key to submit directly;

At this time, the file color changes to normal and there is no letter prompt, indicating that the file has been submitted to git.

You can also submit using the quick submission method. The so-called quick submission means submitting new files or modified files directly without saving them to the temporary storage area first. The operation of adding to the staging area is omitted;

is as follows. If we submit the modified file without saving it to the staging area, vs code will give a warning. In this case, we select "Always" , the operation of adding to the staging area will be automatically omitted in future operations.

4. Modify the submitted file

After modifying the content of the submitted file, the file name will have the following prompt ;

At this time, the file name turns yellow, and there is a prompt letter M; M means

modify, that is, it has been modified.

If you want to undo the changes, enter the source code management and click the return arrow to abandon the changes;

5. View/New /Switch branch

Click "master" in the status bar at the bottom of vs code to display the branches in the project. The master here means that the current branch is master; as shown in the figure below, there are only A master branch;

Create a branch and click "Creating a new branch...";

At this time the project There are already two branches in;

To switch branches, just click on the corresponding branch name;

6. Merge branches

We first create a new branch Modify the file content in the xiaoma branch and submit it;

Then switch to the master branch. At this time, the master branch has no modified content;

Next to merge, first click the settings icon"⚙" to open the command panel;

Search for git in the command panel merge, find the merge branch operation, and click Merge Branch;

At this time, the master branch already has xiaoma related operations;

7. Temporarily save the current branch status

When we are halfway through writing the code and have not completed the development of a certain module, we have to leave the current branch. When switching to another branch, you need to temporarily save (store, hide) the status of the current branch, which is equivalent to the git command git stash;

After making certain modifications to the current branch, click More “···”, find storage-->Storage;

##8. Check what modifications have been made to the current file

When we are modifying the content of a file that has been submitted to git, vs code will prompt us what operations we have done, which is equivalent to the git command git diff, as follows:

Blue It means that the code here has been modified or deleted

Green means that the code here is new content


## Remote class operations

1. Create a new GIt warehouse

Remote class operations need to be performed in conjunction with Gitee, so we first create a new one in gitee For a warehouse, go to the gitee homepage and click New Warehouse;

The created warehouse is as follows, we already have the SSH address;

2. Clone the project (git clone)

First copy the SSH link obtained by the new warehouse, open the command panel in vs code, enter git clone to find the clone option;

Click and paste our SSH address and press Enter. At this time, vs code will prompt us to select an address to store the cloned project, and then start cloning, as follows;

After successful cloning, the project can be opened locally.

3. Push the project (git push)

We first create some random files in the project we just cloned and put them submit;

Enter source code management, click more “···” Find push to push;

After the push is successful, as follows, you can see our submission record in Gitee;


4. Clone the cloud project to local (git pull)

Pull the cloud project in Vs Code, enter source code management, select more"···", select "Pull" to perform the pull operation;

Note: Whenever you push a project (push), it is best to pull the cloud code (pull) first to ensure that the cloud has been updated to the latest status to prevent pushing the project code conflicts;

For more knowledge about VSCode, please visit: vscode tutorial!

The above is the detailed content of A thorough understanding of the configuration and use of git in VSCode in one article. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:csdn.net
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template