如何在webstorm下使用git

7,351 阅读5分钟

        虽然使用git命令才是王道,但是使用工具能减轻我们的工作,何乐而不为呢?

        本文主要介绍如何在webstorm下使用git提交代码,拉去代码,合并分支,解决冲突等基本操作

      使用webstorm提交代码前,首先需要确保你的电脑安装了git,并且在webstorm中引入了git,如下图所示

       如果还没有安装git的同学请自行百度安装。下面我将在介绍如何在webstorm进行git命令的一些常用的操作,本教程会讲解各个操作背后都使用了什么git命令。

1. 拉取git代码

       拉取github上的代码是我们日常开发中最常用的命令了,我挺喜欢这个操作的,但是写多了,感觉还是挺费时间的,使用webstorm就很轻松了。

git clone git@github.com:xxxxxx/xxx.git

      那么如何克隆代码呢?入口如下: 菜单栏下的VCS  ---> Git ---> Clone... ,点击 Clone 按钮后显示如下,URL : 输入你的仓库地址, Directory:选择存放你仓库的本地目录,最后点击clone即可拉取github上的代码......                  

2. 提交代码

       拉取完本地仓库后,修改仓库中的文件后,git会对这些文件进行自动地追踪,那么如何提交代码呢?如果你有在仓库中添加新的文件,那么你需要使用 git add xxx/xxx 添加文件至待提交的状态,一般来说这个命令能将未被 git 追踪记录( untracked )的文件加入 git 仓库的记录中,然后使用 git commit -m 'xxxx' 将文件添加到推送到本地仓库中,最后使用 git push 命令将本地仓库推送到远程仓库。

git add xxx/src

       鼠标右键点击你的工程目录: Git --->  Add

git commit -m '这是test'

       鼠标右键点击你的工程目录: Git ---> Commit Directory...  ,会有弹窗如下,在commit Message下你可以输入你实现了什么功能,修改了什么bug,最好就是能够让审查你的代码的人知道你大概做了什么。

git push

        最后就是直接提交代码到远程仓库了,鼠标右键点击你的工程目录:Git ---> repository ---> push ,会有弹窗如下,它会让你确认你即将要提交的代码,这可以让你很清晰地知道你即将要提交什么代码到远程仓库上面去,这是我入坑的一个比较重要的原因,他可以防止我们误操作提交一些你本不想提交的代码。

4. 更新本地仓库

       git是一个很好的版本控制工具,而且能让我们进行多人合作开发,很多时候,我们需要更新我们的本地仓库,不然的话,后面你开发一个需求太久的话,push到远程仓库后会导致一大堆的冲突,所以,我们时不时的需要更新我们的本地仓库。更新我们的本地仓库有两种方式可 以实现:

  1. git pull
  2. git fetch再 git merge  

       git pull 相当于 git fetch + git merge及更新远程仓库的代码到本地仓库,然后将内容合并到当前分支

       webstorm如何使用git pull  呢?操作如下:Git ---> repository ---> push

       git fetch 和 git merge又该如何操作呢?

       git fetch:Git ---> repository ---> fetch

       git merge直接看下图:webstorm右上角会有类似这样的图标,点击会有弹窗

                

弹窗如下:

                  

5. 查看分支的提交记录

      查看一些分支的提交记录是我们很日常的操作

git log

      webstorm操作入口:鼠标右键点击你的工程目录:Git ---> Show History... ,点击Branch可以查看不同分支的一些提交记录。

6. 新建分支并切换分支

        项目开发过程中,我们经常需要修复一些bug,这是我们就需要提个补丁分支出来。我们可以使用  git branch xxx 新建分支,使用 git checkout  xxx 切换到新建的分支

git branch  test // 新建test分支
git checkout test  // 切换分支

// 上面两个命令可以合为一个命令进行使用
git checkout -b test 

        点击编辑器右下角的的git按钮,点击New Branch 会有弹窗,输入分支名就可以新建并切换到对应的分支。如果想切换分支,可以直接点击对应的分支名直接进行切换,虽然你没有看到可以输入的输入框,这里我要告诉你,你可以直接键盘输入你的分支名,会有神奇的事情发生哦,输入框出现了,你可以搜索你的分支名进行切换。

7. 合并分支并解决冲突

        多人合作开发的项目少不了需要进行不同分支之间代码的合并,这个过程难免会出现代码的冲突,这时候就需要解决冲突了。git 如何合并远程分支的代码呢?使用以下命令即可

git merge xxx // xxx代表远程或者本地的分支

        合并按钮入口:右下角git 按钮,请看图

        

      通常分支的合并冲突是很难避免的,所以你会看到以下的弹窗,点击 merge 按钮开始解决冲突吧......

            

       一本也就几个文件需要解决冲突,如果真的跟很多的文件产生冲突,那你也只能一个一个解决了。具体操作看下图

        

       解决冲突还是挺简单的,但是最好还是需要确认那些代码是哪个小伙伴写的。看下图,一些基本的操作可以看看怎么整。

以上就是我日常使用webstorm提交代码的一些基本操作了,希望看过的小伙伴能够有所收获,本人也只是最近才用webstorm操作git,所以一些功能也正在探索中,后面如果有发现什么好的操作,如果路过的小哥哥或者小姐姐在webstorm下有什么有意思的操作欢迎在下方留言。