组件库项目前期知识准备——Git/github(团队协作)| 青训营笔记

102 阅读7分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 9天

前言

我们团队准备开发组件库,在github上进行团队协作,之前对github的使用仅限于clone,git也用的很少,只限于commit和clone,所以这次就对git进行一个完整的学习,结合github和vscode对git进行一个常用操作的学习。

git学习:

1.git基础学习

image.png

git add是加到自己的暂存区,而git commit是上传到远程仓库,是提交

如果没有.git 需要git init才能把这个文件夹变成仓库,才可以使用git的功能

可以看github官方文档

image.png

2.分支fork和branch

分支的概念是我要理解的,大家各写各的最后再合起来,所以我要fork(分支

  • fork 只能对代码仓进行操作,且 fork 不属于 git 的命令,通常用于代码仓托管平台的一种“操作”
  • clone 是 git 的一种命令,它的作用是将文件从远程代码仓下载到本地,从而形成一个本地代码仓
  • branch 是一个git命令,特征与 fork 很类似,fork 得到的是一个新的、自己的代码仓,而 branch 得到的是一个代码仓的一个新分支。对于远端仓库来说,默认有一个 master (main)的分支,也叫作主干。当你接到了一个新的需求,你可以拉一个分支出来,在这上面修改代码而不影响原主干代码,等修改测试完毕后再合并到主干上去。

区分了之后我就明白了,fork是fork到自己的仓库里面,所以我要做的是fork,那么使用branch也可以,但是这样的话就最后提交还是在别人的远程仓库,而不是在我的仓库里面,这时使用fork会更好,就算在自己的仓库里面提交到自己的远程仓库里,最后呢需要合并的时候再pull request就可以了。 fork的权限更大

参考啊这篇文章就好了,告诉我们为什么要选择fork,以及后续的操作

如何利用github进行多人协作开发 - 掘金 (juejin.cn)

这个文章写的超级详细,一下就明白了

GitHub的Fork 是什么意思 - N神3 - 博客园 (cnblogs.com)

使用 Git 的一点点疑惑:fork 跟 branch 的关系_曾经去过跨越一个小时的地方的博客-CSDN博客

3.同步更新仓库

当我们再更改代码的同时维护者也会更新代码,为了使我们的代码保持最新,需要拉取维护者最新代码

首先git remote -v查看远程仓库,最开始是没有维护者的远程仓库的,此时我们可以主动添加仓库,使用命令git remote add upstream url

4.github的一些操作

readme.md,编辑这个文档会在主页进行展示

点击仓库的comiit次数(时光机)可以看到所有的提交记录,点击哈希值可以看到具体的代码,其中绿色的代码是更新的代码,红色的则是之前的代码。

主分支以前叫master(主人),但是因为美国黑人歧视的问题,所以现在的主分支都叫main,然后其他的分支就是代表开发的不同的功能,最后都会合并到主分支上

issues就是给你提问题的,opne是没有回答的,closed是已经解答的

找开源项目的一些途径
github.com/trending/
github.com/521xueweiha…
github.com/ruanyf/week…
www.zhihu.com/column/mm-f…

特殊的查找资源小技巧-常用前缀后缀
• 找百科大全 awesome xxx
• 找例子 xxx sample
• 找空项目架子 xxx starter / xxx boilerplate
• 找教程 xxx tutorial

想要在github上玩的开心,我想英语是最重要的,学习英语永无止境啊

5.结合vscode使用git

本次记录是参考b站的一个视频,讲的特别的好,也很详细

(40 分钟学会 Git | 日常开发全程大放送&搭配Github_哔哩哔哩_bilibili)

ps:在vscode上图形化操作git要下一个扩展:GitLens,

在终端下拉按钮选择你想要的终端,选择git就可以进到git终端了 image.png

image.png

U表示是新的文件

+表示是加到暂存区

在消息栏输入提交的信息,然后按回车,就会从暂存区提交到仓库

image.png

每个commit会有一个哈希值,可以通过这个哈希值找到自己的提交

添加文件到暂存区:git add -A
把暂存区的文件提交到仓库:git commit -m "提交信息"
查看提交的历史记录:git log --stat

git log (-status 详细的)查看提交,除了输入命令,可以在commit里面直接查看

image.png

维护项目的日常

image.png

在vscode中则是

1.直接点击返回的箭头就可以了(文件还在暂存区,没有提交)

2.在已经提交的文件上右键 undo commmit就打回暂存区,再点击—号就回到工作区了

git分支

image.png

让多人协作成为可能,主分支是默认开发好的,其他分支是还在开发的。

合并(merge)

image.png 合并是在主分支上合并你需要合并的分支

但一般会有合并冲突,就是多人都进行了修改,所以要进行选择

image.png

current是现存的,incoming是要合并进来的,进行选择。

特别注意上面提示的选项,aceept进行选择,both是都要,然后人工进行修改。

合并完之后要进行提交

image.png

如果决定全都采用某一个的

image.png

git与github

image.png

第一次推送:

(push)提交到github(第一个是自己的github仓库名)

image.png 之后就可以直接使用git push就好了

拉取github仓库的变更:git pull,输入之后就会拉取github上的内容到本地

image.png

ps:当你本地准备提交更新的时候,如果远程也有更新,那么会让你先pull,再push进行更新,这也算是很合理的。(pull也是一个合并的过程,出现冲突处理办法和之前是一样的)

实操报错

报错1:

fatal: unable to access 'github.com/jiale233/Ku…': Failed to connect to github.com port 443 after 21102 ms: Timed out

这个报错就是无法连接上,有说是ssl代理的问题,我取消了,但是没用

git config --global http.proxy 这个就是查询代理的,如果没有代理什么都不会输出。

git config --global --unset http.proxy //取消http代理

git config --global --unset https.proxy //取消https代理

解决方法: 实在是无语的很,我最后在git push后面加了一个仓库网址就OK了,给我整无语了,但是vscode无法自动推送,只能手动推送,不知道是什么原因

image.png

报错2:

image.png 这个报错是说明github上有更新,所以要先pull,然后再push就可以了

git提交规范

image.png

这个pull request是在自己fork下来的仓库里进行的,不是在原来的仓库里进行的 github的pull Request使用 - 俄小发 - 博客园 (cnblogs.com)

git合并原则

git合并原则,别人的东西不要动,别人怎么写的,自己不要加多余的注释 可以自己本地看看,但是不要给别人乱加东西。

此外如果自己要修改别人的东西,不要把别人原始的删掉,要给它注释掉,这样管理者在最后合并的时候才知道要不要采用你的,不然你改了它就不知道原来的是什么了,无法做出判断就很麻烦。

遵守一个原则:只要不是自己的东西都不要删,尽量不去加东西,如果要改,一定要注释掉,并且要检查有没有影响

github接受合并请求

作为仓库的管理者,我们会收到pul reuqest的请求,这是我第一次收到,记录一下

F3M3EDL68T}4G5$E)S4T(F3.jpg 会以邮件的方式通知你,然后前面的就是这次合并的序号,是#11,然后你要看的是files changed里面的内容,看看修改了哪些,最重要的是看看有没有改动主体的源码,不能随便合并,还是要审查一下。