源代码管理

Git 是宁皓独立开发者训练营选择使用的源代码管理工具,我们要使用 Git 对开发的应用项目做源代码管理。

在训练任务中需要使用 Git 做的一些事情:

  • 克隆远程仓库
  • 初始化本地仓库
  • 创建并切换分支
  • 完成任务后做提交
  • 合并分支
  • 将本地提交推送到远程仓库

在训练营里有一组任务会专门练习使用 Git,您可以跟随训练任务一步一步去准备 Git,修改配置,做提交,创建与合并分支,使用远程仓库等等。此文可以辅助您准备好必要的工具,介绍一下工作流程,再熟悉一下相关的关键概念。

Git

Git 是一种源代码管理工具,也可以说是版本控制工具。使用 Git 对开发的项目做源代码管理,是任何开发者都必备的一项重要的技能。Git 是一个命令行工具,也就是你需要在命令行界面下通过执行 git 命令完成要做的事情。

官方网站https://git-scm.com/

安装

Windows 用户安装的 cmder 里面自带 Git,macOS 系统里也会自带 Git,如果需要使用更新版本的 Git,可以到它的官网下载并安装。

确定在系统里是否已经安装了 Git,可以在终端执行:

git --help

执行上面的命令如果能看到帮助信息,说明在系统里已经安装了 Git。

配置

使用 Git 做提交时,会在提交中记录做这次提交的用户是谁,这些用户相关的信息可以通过 Git 的全局配置来设置。

配置全局用户名

git config --global user.name "wanghao"

将 wanghao 替换成您自己的用户名。

配置全局用户邮箱

git config --global user.email "wanghao@ninghao.net"

wanghao@ninghao.net 替换成您自己的邮箱地址。

查看配置信息

git config --list

执行上面这个命令会列出 Git 当前使用的配置信息,可以确定一下 user.name 与 user.email 这两个配置的值。

仓库

在项目里创建一个仓库(repository),就可以对项目做源代码管理了。Git 会把它需要的东西都存储在这个仓库里,这个仓库其实就是一个名字是 .git 的目录,Git 帮我们管理这个目录里的东西,所以通常我们不需要关心仓库里到底都放了些什么,需要做什么都可以通过执行 git 命令完成。

创建仓库

在项目里创建一个仓库,可以执行 git init 命令,它会在项目里初始化一个代码仓库,也就是在项目里创建一个 .git 目录,里面会包含一些必要的东西。

git init

在项目所在目录的下面,执行上面这行命令会给项目创建一个仓库,这个命令只需要执行一次。

删除仓库

如果想重新对项目做源代码管理,可以把项目当前的仓库删除掉,然后再重新执行 git init 命令初始化一个新的仓库。

rm -rf ~/desktop/xb2-node/.git

执行上面这行命令会将桌面上的 xb2-node 这个项目的仓库删除掉。

提交

提交(commit)可以保存项目当前的状态。在项目里创建了新的文件或是修改了文件里的代码,这其实都是在改变项目的状态,如果你想保存一下项目当前的状态,就可以对项目做一次提交,提交时可以设置一条信息,记录并说明一下为什么要做这次提交,方便以后可以随时查阅。

提交的流程

  1. 查看状态。执行 git status 命令,查看一下项目当前都做了哪些修改。
  2. 添加修改。执行 git add 命令可以添加要包含在此次提交里的修改。
  3. 确定提交。执行 git commit 命令确定提交。

示例

git status
git add .
git commit -m '修正环境变量名称'

分别执行上面这几行命令会对项目做一次提交。git add . 会把当前项目里的修改全部添加到暂存区准备提交,然后执行 git commit 命令确定提交,用 m 选项给这次提交添加一条描述信息。

在本地使用带图形化界面的 Git 软件,可以更方便地做提交,比如使用 VSCode 编辑器自带的源代码管理功能,或者使用 Sourcetree。

查看提交历史

git log

执行上面这个命令可以查看项目的提交历史,每条历史记录都会显示提交的 ID(commit)、作者(Author)、日期(Date)、还有提交信息。

示例

commit 4e6a75bfc61d9bbbc1a0b3f2ab3ed3f75e6ae5ad
Author: wanghao <wanghao@ninghao.net>
Date:   Sat Apr 23 08:06:49 2022 +0800

    修正环境变量名称
  • ID:4e6a75bfc61d9bbbc1a0b3f2ab3ed3f75e6ae5ad
  • 作者:wanghao <wanghao@ninghao.net>
  • 日期:Sat Apr 23 08:06:49 2022 +0800
  • 信息:修正环境变量名称

提交的作用

提交会记录对项目所做的修改,保存项目的一个状态,通过提交的 ID 可以引用这次提交。我们可以查看在这次提交里包含的修改,比如修改了项目里的哪些文件,哪几行代码等等。也可以检出(checkout)这次提交,查看当初项目在做这次提交时的样子。还可以还原(revert)这次提交对项目做的修改,或者将项目重置(reset)到做这次提交时的状态。

提交是不能被修改的,比如提交的作者、日期或者包含在提交里的修改,所有这些东西都是不能修改的,也就是一但确定了提交以后,就无法再修改这次提交了。我们可以重做最后一次做的提交,可以还原之前做的提交,这需要做一次新的提交保存还原之后的状态。

分支

分支(branch)是实践想法,添加新功能,修复 Bug 的好地方。在开发应用时,做这些事情之前都可以创建新的分支,然后在新的分支上去开发新功能或者修复 Bug 等等,无论我们怎么折腾都不会影响到其它分支上的项目。如果成功了,可以将在这些分支上做的提交合并到项目的主分支上,如果想法不成立或是新功能很失败,可以删除这些分支。

master / main

给项目初始化了一个仓库以后,默认会创建一个 master 分支,这个分支跟我们自己创建的分支并没有什么区别,只不过按习惯我们会将其称之为主分支。

查看分支

执行 git branch 命令可以列出项目里的分支,名字前面带 * 号的分支是项目当前所在的分支。

git branch

查看全部分支

git branch -a

如果想显示全部的分支(包含远程分支),可以在命令里使用 a 选项。

创建分支

在开发项目时我们可以任意创建需要的分支,创建分支的时候需要指定一个起始提交,这样新创建的分支上就会包含这次起始提交以及在这次提交之前做的所有的提交。在每条分支上可以包含只属于自己的提交,这些提交会在创建分支时指定的那个起始提交之后。

示例

git branch payment

执行上面这个命令会创建一个新的分支,名字叫 payment,创建这个分支时并没有特别指定这个分支的起始提交,所以默认会基于当前分支的最后一次提交创建这个分支。假设当前分支是 master,在这个分支上的最后一次提交是 “添加 README.md”,这样在新创建的 payment 分支的提交历史里,最后一次提交也会是 “添加 README.md” 。

切换分支

使用 git checkout 命令可以切换项目当前的分支。

示例

git checkout payment

执行上面的命令会将项目当前分支切换到 payment,执行 git branch 命令可以查看项目当前的分支。

创建新分支并切换到这个分支上

git checkout -b payment

如果要切换到的分支并不存在,可以在命令里使用 b 选项,这样可以创建新的分支并且切换到这个新的分支上。

合并分支/历史

用 git merge 命令可以合并分支,也可以说是合并提交历史。

示例

git checkout master
git merge payment

假设当前是在 payment 这个分支上,之前在这个分支上做了一些新的提交,现在打算将这些提交合并到 master 分支上,可以先将当前分支切换到 master,然后执行 git merge 合并 payment 分支,这样在 payment 分支上做的那些提交就会合并到 master 分支上了。

删除分支

使用 git branch 命令,外加 d 选项可以将不再需要的分支删除掉。

示例

git branch -d payment

执行上面的这个命令会将 payment 这个分支删除掉。注意我们不能删除当前所在的分支,比如想要删除 payment 分支,需要先将当前分支切换到其它的分支上,然后再删除它。

强制删除分支

git branch -D payment

要删除的分支包含尚未合并的提交也是无法删除的,如果要强制删除这样的分支,需要使用大写的 D 选项。

忽略

在 .gitignore 文件里可以列出要忽略不做源代码管理的东西。

.gitignore

在项目里创建了一个仓库以后,默认 Git 会跟踪这个目录里所有的文件。不过在项目里有些东西是不用做源代码管理的,比如一些日志文件,用户上传的文件,系统自动生成的一些文件等等,这些东西可以在 .gitignore ** 文件里说明一下。这个文件一般要放在项目根目录的下面。

.gitignore 文件内容示例

# compiled output
/dist
/node_modules

# Logs
logs
*.log
npm-debug.log*

# OS
.DS_Store

# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json

在 .gitignore 文件中,带 # 号前缀的是注释内容。

  • */dist,*指的是 dist 目录,这样就会忽略掉这个目录里的所有的文件。
  • **.log,*指的是忽略掉所有文件名里带 .log 后缀的文件,* 表示所有。
  • .vscode/,指的是*忽略掉 *.vscode* 目录里的所有的文件。
  • !.vscode/settings.json,指的是不忽略 .vscode/settings.json 文件,! 号表示否定。

忽略已被 Git 跟踪的文件

.gitignore 文件的作用就是告诉 Git,项目里哪些文件不需要做源代码管理。不过有一种情况是例外,就是如果文件已经被 Git 跟踪了,就是已经做了源代码管理,这时如果在 .gitignore 文件里列出这些东西,Git 仍然会对这些东西做源代码管理。如果想忽略这些东西,可以执行下面这几行命令:

git rm -r --cached .
git add .
git commit -am "删除忽略的文件"

远程

在 Git 语境下,远程(remote)指的是远程仓库。

项目有本地仓库,也可以给它添加一个远程仓库,这需要先在远程仓库的服务商那里为项目创建一个远程仓库,然后将其添加到本地项目里,这样就可以将本地仓库上传(push)到远程仓库里了,也可以从远程仓库那里拉取(pull)最新的提交。远程仓库有点像是项目的备份与合作中心,其实本质上远程仓库与本地仓库没什么区别,所以可以把它想成是在网络其它地方的一个仓库。

远程仓库服务商

GithubCoding 都提供远程仓库服务,你可以选择使用其中任意一个。

用 SSH key 验证身份

在远程仓库服务端那里注册了帐户以后,可以配置使用 SSH key 的方式验证身份,这样以后将本地仓库推送到远程仓库时,就可以通过本地的钥匙验证用户身份,也就是不再需要输入在远程仓库服务商那里注册的用户名与密码了。使用 SSH Key 的方式验证身份,就是将本地用户主目录下存放的公钥文件里的内容,添加到远程仓库服务商那里。

输出本地公钥文件内容

cat ~/.ssh/id_rsa.pub

执行上面的这行命令可以输出用户主目录下的 .ssh 目录里的 id_rsa.pub 文件里的内容。复制一下输出的这个文件里的内容。

配置 Github 帐户的 SSH key

  1. 登录 Github
  2. 打开用户的 Settings(设置)。
  3. 打开设置页面边栏上的 SSH and GPG keys
  4. 点击 SSH keys 右侧的 New SSH key
  5. Title 里随便输入一个标题,将复制的用户公钥文件内容粘贴到 Key 里面。
  6. 点击 Add SSH key,确定添加。

在 Github 账户设置添加 SSH Keys

配置 Coding 帐户的 SSH key

  1. 登录 Coding
  2. 打开 个人账户设置
  3. 打开 SSH 公钥
  4. 点击 新增公钥
  5. 公钥名称 里输入一个名字,然后将复制的用户公钥文件里的内容放在 公钥内容 里。
  6. 选择 公钥有效期
  7. 点击 确认,确定添加公钥。

在 Coding 个人账户设置添加 SSH 公钥

创建远程仓库

在远程仓库服务商那里为项目创建一个远程仓库。

在 Github 创建远程仓库

  1. 登录到 Github。
  2. 点击右上角+号图标,选择 New repository
  3. 输入 Repository name(仓库名称)。
  4. 选择 Public(公开) 或 Private(私有)。
  5. 点击 Create repository(创建仓库)。

在 Github 创建远程仓库时,仓库的名字在你的账户里应该是唯一的,也就是不能有重名的仓库。创建仓库时可以选择这个仓库是公开还是私有,如果选择 Public(公开),任何人都能够查看或克隆你的项目仓库。如果选择 Private(私有),默认只有你自己可以使用这个仓库。你可以通过配置仓库,邀请他人共同开发项目。

在 Github 创建仓库

在 Coding 创建远程仓库

在 Coding 创建远程仓库的流程与 Github 略有不同,首先你需要创建一个项目,然后在这个项目里再去创建代码仓库。

  1. 登录 Coding。
  2. 选择并打开项目(创建新的项目)。
  3. 打开项目的代码仓库,点击 创建代码仓库
  4. 设置 仓库名称、仓库描述,选择 是否开源
  5. 点击 完成创建

在 Coding 创建代码仓库

远程仓库地址

无论是在 Github 还是在 Coding 上创建的仓库,都提供两种类型的仓库地址,一种是 HTTPS,一种是 SSH。

这两种仓库地址唯一不同的地方就是验证身份的方式,如果使用 HTTPS 类型的地址,就需要通过用户名与密码完成身份验证,如果选择使用 SSH 类型的仓库地址,可以通过 SSH 钥匙完成身份验证。

Github 仓库地址

Coding 仓库地址

管理项目的远程仓库

创建了远程仓库以后,可以将它添加到项目里使用。

在项目里可以随便添加远程仓库,其实就是给要添加的远程起个名字,再设置一个对应的仓库地址,以后可以使用给远程起的名字引用对应的远程仓库。

添加远程

使用 git remote add 命令可以给项目添加远程。

示例

git remote add origin git@github.com:wanghao8080/xb2-node.git

在终端,项目所在目录的下面执行上面这行命令可以给项目添加一个名字是 origin 的远程,对应的地址就是之前我在 Github 上创建的一个仓库的地址。origin 是一个远程的命名惯例,并没有特别的意思,你可以随意命名远程。

项目可以同时拥有多个远程:

git remote add coding git@e.coding.net:ninghao/xb2/xb2-node.git

执行上面的命令会给项目添加一个名字是 coding 的远程,对应的地址是我在 Coding 创建的一个代码仓库的地址。

查看远程

git remote -v

执行 git remote 可以列出项目的远程,配合 v 选项可以显示更详细的信息。

删除远程

要删除项目里的远程,可以使用 git remote remove 命令。

示例

git remote remove coding

执行上面这行命令会将项目里的名字是 coding 的这个远程删除掉。

使用远程仓库

为项目添加了远程以后,我们可以将本地项目推送到指定的远程仓库里,也可以从某个远程那里获取到最新的提交。

推送

使用 git push 可以将本地的东西推送到指定的远程那里。

使用这个命令的时候要指定远程的名字,还有要推送的东西,一般就是一个本地分支的名字。

示例

git push origin master

执行上面的命令会将本地的 master 分支推送到 origin 这个远程,这个 origin 指的具体是哪里,要看当初添加这个 origin 远程的时候设置的远程仓库的地址是什么。成功以后可以到远程仓库页面那里刷新一下,应该会出现项目的代码,远程里也会包含一个 master 分支。

以后在本地的 master 分支上有了新的提交,都可以执行 git push 命令,将这些新做的东西推送到 origin 这个远程。

拉取

使用 git pull 命令可以将远程上的新东西拉取到本地。

示例

git pull origin

执行上面的命令可以将 origin 这个远程里的新东西下载下来并合并到本地。这个命令的功能相当于先用 git fetch 从远程那里下载最新的东西,然后用 git merge 将这些新东西合并到本地。

克隆

使用 git clone 命令可以将远程仓库克隆到本地。

示例

cd ~/desktop
git clone https://github.com/ninghao/xb2-node.git

执行上面这两行命令,会将一个远程仓库克隆到本地电脑的桌面上,默认会放在 xb2-node 这个目录的下面。

git clone 只需要执行一次,如果克隆的是自己创建的远程仓库或者有权限管理的远程仓库,可以使用 SSH 类型的地址,如果克隆的是别人的代码仓库,可以选择使用 HTTPS 类型的仓库地址。

完成以后在本地应该就会出现一个跟远程仓库里一模一样的项目了。项目里会包含一个 origin 远程,指向的就是当时克隆的那个远程仓库。

基于远程分支创建本地分支

克隆完成以后,默认在项目里会有一个 master 本地分支,如果你想使用远程里的其它的分支,需要基于远程分支创建一个本地的分支。首先可以执行 git branch -a 查看当前所有的分支,你应该会发现一些 remotes/origin/* 这种名字的分支,这些就是在远程仓库里的分支。

示例

git branch audit remotes/origin/audit

上面这行命令会基于 remotes/origin/audit 这个远程分支创建一个名字是 audit 的本地分支。这样你就可以切换到 audit 这个本地分支了,在这个分支上的项目跟远程里的那个 audit 分支上的项目是一样的。

协作

远程仓库为项目开发提供了一个合作中心,我们可以邀请他人成为项目的协作者,这样大家就可以一起开发项目了。每个人在本地都有一份项目的仓库,大家可以在本地进行开发,然后将新做的提交推送到远程仓库,团队的协作者可以从远程拉取他人新做的这些提交。

为 Github 仓库添加协作者

  1. 在远程仓库页面,打开 Settings(设置)。
  2. 打开边栏菜单里的 Collaborators(协作者)。
  3. 点击 Add people(添加),搜索要添加的协作者的用户名并选择。
  4. 被选择的用户会收到一封邮件,对方确认以后就会正式成为项目的协作者。

Github 仓库设置下的 Collaborators

为 Coding 仓库添加协作者

在 Coding 里需要在项目级别添加项目的成员,然后设置成员的权限。

Coding 项目添加成员的界面

图形界面

在本地开发时可以使用带图形界面的 Git 软件,比如 Sourcetree,或者使用 VSCode 自带的源代码管理功能。

Sourcetree

Sourcetree 是一款带图形界面的 Git 软件,也就是使用它我们可以通过图形界面完成需要执行 git 命令完成的事情,比如做提交、查看提交历史、创建分支、推送与拉取等等。

这款软件可以辅助你完成一些训练任务,比如我们在《小白的开发之路:Node.js 服务端应用开发实践》中开发了一个Node 应用,每完成一个任务我都会做一次提交,你可以将这个项目克隆到本地,然后使用 Sourcetree 打开这个本地仓库,这样就可以查看项目的提交历史,可以检查每一次提交对项目都做了哪些修改。你还可以很方便的检出(checkout)到任意一次提交,这样你在 VSCode 编辑器那里看到的项目,就是我做完这次提交时的样子。

Sourcetree 软件屏幕截图

VSCode

VSCode 编辑器自带源代码管理功能。

使用 VSCode 源代码管理

点击活动栏上的源代码管理小图标可以打开源代码管理功能,或者使用快捷键 ctrl + shift + G。点击源代码管理右侧的 ... 小图标会弹出一个源代码管理相关功能的菜单,或者也可以在命令面板里搜索执行 Git 相关的命令。

VSCode 编辑器源代码管理

在 VSCode 命令面板里搜索 Git

使用 VSCode 源代码管理做提交

  1. 修改项目。
  2. 打开 VSCode 源代码管理。
  3. 添加在 更改 下面列出的修改,或者点击 更改 右侧的 + 号添加全部修改。
  4. 添加的修改会在 暂存的更改 下面出现,这些就是要包含在本次提交里的更改。
  5. 在文本框里输入提交日志,然后按下 command + enter 或者点击源代码管理右侧的对号小图标确定提交。

VSCode 源代码管理功能

训练营路线
选择训练路线
这是您成为应用开发者唯一需要做的系统训练,参加宁皓网独立开发者训练营,给自己一次机会,未来价值百万甚至亿万的应用产品将会出自您手。
预热
理解应用开发,准备开发工具与环境,学习程序语言基础,测试自己是否适合成为开发者。
599
客户端
获得客户端应用开发能力,独立开发 Web 前端应用或 iOS 与安卓应用。
2,999
服务端
获得服务端应用开发能力,独立开发基于 Node.js 技术的服务端应用。
2,999
全栈
获得多平台应用开发能力,独立开发完整应用,包括前端、移动端与服务端。
3,699
3,999