【从0开始学前端】 Git版本控制系统

1.认识Git

Git概念:一个免费开源,分布式的代码版本控制系统,帮助开发团队维护代码

作用:记录代码内容,切换代码版本,多人开发时高效合并代码内容

如何学:

个人本机使用:Git 基础命令和概念

多人共享使用:团队开发同一个项目的代码版本管理

2.配置Git

Git安装

点击安装包,选择路径后默认下载即可

在电脑安装Git后,打开bash终端,输入git -v查看版本号

打开vscode终端后,小箭头处打开Git bash终端

版本号如下

之后设置自己的姓名和邮箱,使用命令git config --list进行查看

Git 配置用户信息

在vscode终端配置用户名和邮箱,应用在每次提交代码版本时表明自己身份

命令:姓名邮箱自定义

git config --global user.name "zhangsan"

git config --global user.email "123456@126.com"

3.Git仓库

Git 仓库(repository):记录文件状态内容的地方,存储着修改的历史记录

创建:

  1. 把本地文件夹转换成 Git 仓库:命令 git init
  2. 从其他服务器上克隆 Git 仓库

使用命令后可以得到隐藏的Git仓库

Git使用

工作区:实际开发时操作的文件夹

暂存区:保存之前的准备区域(暂存改动过的文件)

版本库:提交并保存暂存区中的内容,产生一个版本快照

git add 文件名------暂存指定文件

git add .------暂存所有改动的文件

git commit -m "注释说明"------提交并保存,产生版本快照

在使用上方命令时,一定要写清楚文件路径

4.Git文件状态

使用 git status -s 可以查看文件状态

使用 git add . 可以把全部文件都暂存

✓ 未跟踪:新文件,从未被 Git 管理过

✓ 已跟踪:Git 已经知道和管理的文件

文件状态 概念 场景
未跟踪(U) 从未被 Git 管理过 新文件
新添加(A) 第一次被 Git 暂存 之前版本记录无此文件
未修改('') 三个区域统一 提交保存后
已修改(M) 工作区内容变化 修改了内容产生

在上次添加html后,html已经被跟踪,所以css没有被跟踪

5.暂存区使用

暂存区:暂时存储,可以临时恢复代码内容,与版本库解耦

暂存区 -> 覆盖 -> 工作区,命令:git restore 目标文件(注意:完全确认覆盖时使用)

从暂存区移除文件,命令:git rm --cached 目标文件

6.Git回退版本

把版本库某个版本对应的内容快照,恢复到工作区/暂存区

查看提交历史:

git log --oneline

git reflog --oneline回退之后未来的提交记录

回退命令:

git reset --soft 版本号(其他文件未跟踪)

git reset --hard 版本号

git reset --mixed 版本号 (与 git reset 等价)

注意1:只有记录在版本库的提交记录才能恢复

注意2:回退后,继续修改->暂存->提交操作即可(产生新的提交记录过程)

git reset --hard 版本号强制覆盖暂存区和工作区

回退版本是从右向左依次辐射

7.删除文件

  1. 手动删除工作区文件
  2. 暂存变更/手动删除暂存区文件造成变更
  3. 提交保存

总结:

工作区只要改变,都可以暂存提交产生新记录

8.忽略文件

概念:.gitignore 文件可以让 git 彻底忽略跟踪指定文件

目的:让 git 仓库更小更快,避免重复无意义的文件管理

例如:

  1. 系统或软件自动生成的文件
  2. 编译产生的结果文件
  3. 运行时生成的日志文件,缓存文件,临时文件等
  4. 涉密文件,密码,秘钥等文件

创建:

1.项目根目录新建 .gitignore 文件

2.填入相应配置来忽略指定文件

注意:如果文件已经被暂存区跟踪过,可以从暂存区移除即可

9.分支

概念:本质上是指向提交节点的可变指针,默认名字是 master

注意:HEAD 指针影响工作区/暂存区的代码状态

创建分支命令:git branch 分支名

切换分支命令:git checkout 分支名

这里是开发时的流程

场景:开发新需求 / 修复 Bug,保证主线代码随时可用,多人协同开发提高效率

例如:

在现有代码上创建新分支完成内容列表业务

突然需要紧急修复 Bug - 单独创建分支解决 Bug

这便是在原有基础上进行,不影响本地进程

Git 分支是指针,指向提交记录

HEAD 指针影响暂存区和工作区的代码

10.合并冲突

这里有两个分支publish和master

假设冲突:把 publish 分支合并到 master 回来,产生合并冲突

概念:不同分支中,对同一个文件的同一部分修改,Git 无法干净的合并,产生合并冲突

解决:

  1. 打开 VSCode 找到冲突文件并手动解决
  2. 解决后需要提交一次记录

避免:(多交流)

  1. 按页面划分不同分支开发
  2. 公共代码在统一文件夹维护
  3. Node等软件版本统一,npm 包统一下载

11.远程仓库

概念:托管在因特网或其他网络中的你的项目的版本库

作用:保存版本库的历史记录,多人协作

创建:公司自己服务器 / 第三方托管平台(Gitee,GitLab,GitHub...)

步骤:

  1. 注册第三方托管平台网站账号
  2. 新建仓库得到远程仓库 Git 地址
  3. 本地 Git 仓库添加远程仓库原点地址
    命令:git remote add 远程仓库别名 远程仓库地址
    例如:git remote add origin https://gitee.com/lidongxu/work.git
  4. 本地 Git 仓库推送版本记录到远程仓库
    命令:git push -u 远程仓库别名 本地和远程分支名
    例如:git push -u origin master
    完整写法:git push --set-upstream origin master:master

12.常用命令

命令 作用 注意
git -v 查看git版本
git init 初始化git仓库
git add 文件标识 暂存某个文件 文件标识以终端为起始的相对路径
git add . 暂存所有文件
git commit -m '说明注释' 提交产生版本记录 每次提交,把暂存区内容快照一份
git status 查看文件状态 - 详细信息
git status -s 查看文件状态 - 简略信息 第一列是暂存区状态,第二列是工作区状态
git ls-files 查看暂存区文件列表
git restore 文件标识 从暂存区恢复到工作区 如果文件标识为 . 则恢复所有文件
git rm --cached 文件标识 从暂存区移除文件 不让git跟踪文件变化
git log 查看提交记录 - 详细信息
git log --oneline 查看提交记录 - 简略信息 版本号 分支指针 提交时说明注释
git reflog --oneline 查看完整历史 - 简略消息 包括提交,切换,回退等所有记录
git reset 版本号 切换版本代码到暂存区和工作区 --soft模式保留暂存区和工作区原本内容 --hard模式不保留暂存区和工作区原本内容 --mixed模式不保留暂存区,工作区保留(默认) 先覆盖到暂存区,再用暂存区对比覆盖工作区
git branch 分支名 创建分支
git branch 查看本地分支
git branch -d 分支名 删除分支 请确保记录已经合并到别的分支下,再删除分支
git checkout 分支名 切换分支
git checkout -b 分支名 创建并立刻切换分支
git merge 分支名 把分支提交历史记录合并到当前所在分支
git remote add 远程仓库别名 远程仓库地址 添加远程仓库地址 别名唯一,地址是.git结尾的网址
git remote -v 查看远程仓库地址
git remote remove 远程仓库别名 删除远程仓库地址
git pull 远程仓库别名 分支名 拉取 完整写法:git pull 远程仓库别名 远程分支名:本地分支名 等价于:git fetch 和 git merge
git push 远程仓库别名 分支名 推送 完整写法:git push 远程仓库别名 本地分支名:远程分支名 -u:建立通道以后可以简写 git push
git pull --rebase 远程仓库别名 分支名 拉取合并 合并没有关系的记录
git clone 远程仓库地址 克隆 从0得到一个远程的Git仓库到本地使用
相关推荐
前端一课1 小时前
【前端每天一题】 第 15 题:CSS 水平垂直居中高频方案(Flex / Grid / transform 等)
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 19 题:什么是重排(Reflow)和重绘(Repaint)?有什么区别?如何减少?
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 14 题:Promise.then 链式调用执行顺序
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 18 题:防抖和节流是什么?区别是什么?如何实现?
前端·面试
前端一课2 小时前
【前端每天一题】第 16 题:数组去重高频方法(Set / filter / reduce / 对象键值法)
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 17 题:什么是浅拷贝与深拷贝?如何实现深拷贝?
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 20 题:从输入 URL 到页面渲染全过程
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 12 题:== 与 === 的区别?为什么 [] == ![] 是 true?
前端·面试
前端一课2 小时前
【前端每天一题】🔥 第 13 题:原型链查找规则是什么?为什么对象能访问到方法?
前端·面试