%% # 纲要 > 主干纲要、Hint/线索/路标 # Q&A #### 已明确 #### 待明确 > 当下仍存有的疑惑 **❓<font color="#c0504d"> 有什么问题？</font>** # Buffer ## 闪念 > sudden idea ## 候选资料 > Read it later %% # VSCode 配置 Git 相关插件 插件总览： ![[05-工具/VSCode/VSCode 通用插件说明及配置#Git 相关|VSCode 通用插件说明及配置]] ### 个人需求&使用总结 ![[#体验总结]] <br><br><br> # Git Graph 插件 ✔️ 功能：提供了**对 Git 仓库完整提交历史的==可视化窗口页面==**，支持**点击执行相关操作**。 插件在下列两处添加了"**按钮**"，点击可**打开插件提供的 "Git Grpah" 页面**。 - **SOURCE CONTROL 面板中** - **底部状态栏** ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-A685FE181E6EB500AC94CA7A531B3F34.png|576]] ### Git Graph 页面 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-814EC313BFFF99A0A5F32F47700D84AB.png|515]] ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-FEF4E1D0AD8DC70E824DED5FBDAB99E6.png|839]] <br><br><br> # GitLens 插件 ✔️ ## 体验总结 - Gitlens 提供的 **Line Blame 功能**可完全替代另一独立插件 Git Blame。 - Gitlens 提供的 **Graph 功能** 为 Pro 付费功能，因此这一需求上**仍需要使用==独立的 Git graph 插件==**。 - Gitlens 提供的下列功能**可实现 =="工作区与不同提交版本间"、"两个不同提交之间" 的文件内容比较==**： - **Revision Navigation 功能**——比较当前文件的 "**工作区** "与 "**当前分支上历史提交 or 指定分支 or 特定 tag**" 差异 - INSPECT 视窗中： - **FILE HISTORY 栏**——比较当前文件的 "**工作区** "与 "**当前分支上历史提交"的差异 - **SEARCH & COMPARE 栏**——比较**任意两个 `<branch,tag,ref,working tree>` 之间的差异** > [!summary] 对我而言，**核心需求是 "Revisoin Navigation" 以及 "Inspect" 窗口下两栏的功能**。 > > 涉及的相关命令如下： > > ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-C0FFFAF02FFE4721AD9E44F4F9B66D96.png|784]] ![[05-工具/VSCode/VSCode 配置 Git 相关插件#^g5e0gr]] #### 关于 "File history" 功能说明 VSCode 、GitLens、Git History、Git History Diff 插件都**提供了类似的功能**。 综合比较后明确，**Gitlens 提供的功能可完全覆盖其他插件的**，且**更加便于使用**。 对比说明： - Gitlens 在 **INSPECT 窗口**中提供的 **"==FILE HISTORY==" 栏** 可以 **==完全覆盖== VSCode 内置 "TIME LINE" 栏的功能** ⭐⭐ - VSCode 在 **Explor 窗口**中内置提供的 **"TIMELINE" 栏**，可以查看**涉及该文件的修改提交历史**; - 缺点：显示了**提交消息、作者、时间**，但是 **==未显示提交的哈希 ID==**。 - 功能：支持**对比任意两项历史提交**，但似乎不支持 "**任一历史提交**" 与 "**当前工作区**" 之间的对比。 参见[^1] ## 功能说明 >参见 [GitHub vscode-gitlens](https://github.com/gitkraken/vscode-gitlens?tab=readme-ov-file#worktrees-pro) 插件功能总结： - **提供一系列视窗**： - **Sidebar** ： - **增强 SOURCE CONTROL 面板** ——引入更多子栏目如 COMMITS，BRANCHS 等 - **独立的 Gitlen 面板** - **独立的 Gitlen Inspect 面板**——Inspect 栏、Line History 栏、File History 栏等； - **底部面板**——用于 Graph 显示等 - **Git Blame 功能**（**Line Blame**） - **Inline Blame Annotatsions**——**当前行尾**显示**该行代码**的**最近提交信息** - **Status Bar Blame**——底部状态栏显示相同的 blame 信息 - **Hovers**——提供**悬浮窗**，鼠标悬停在上述 blame 信息处时将**浮窗显示详细信息** - **Git CodeLens** 功能 - 在**文件顶部**和**每个代码块的开头**显示**最近提交的作者信息** - 支持点击查看更多信息 - **File Annotations** 功能——**编辑页右上角按钮**，点击触发显示下列信息 - **File Blame**——编辑页左侧显示**该文件的提交历史信息** - **File Changes**——编辑页内显示**当前文件的变更** - **Revision Navigation** 功能 ——**编辑页右上角按钮**，点击**显示 diff view 视窗** - **默认比较 "工作区" 与 "暂存区或 HEAD"** - 按住`<Alt>` 后点击，**可选择与任意一个历史提交进行对比**（`<A-LClick>`） - **交互式 Rebase 功能** - **其他 Pro 功能**（收费） ### 插件提供的侧边栏&底部视窗 一个四处，如下图所示： ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-183E3105E390BE59A1F46958E561C1DB.png|812]] #### SOURCE CONTROL 面板增强 额外提供了 COMMITS、BRANCHES 等栏目，如下图所示： ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-6AD97AD43D796A3A232615D7F064CB5C.png|512]] ##### COMMITS 栏 支持操作：**Revert、Rest、Rebase 、基于该 commit 创建分支等等**。 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-7368EB18AA2195C5A90B91F0D9FBCC57.png|434]] ##### BRANCHES 栏 支持操作：**切换到该分支**、**推送分支**、**与多个比较** - **push 该分支** ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-DF4C32BCB2F78259A3279F3E53D483B2.png|627]] - **与 HAED 或 Working Tree 比较**（比较结果显示在 Inspect 视窗下，如上图） ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-81098C48A3A53D2CD021A7B74BB3A6A9.png|638]] - **与其他分支比较**（比较结果显示在 Inspect 视窗下，如上图） ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-4E2994CEDC6D0C20D0C3D5E07831E0E2.png|653]] #### GITLENS 面板 其中罗列了 **Gitlens 插件的所有功能的入口项**。 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-C8A2F79CFEDBAEB045AC746BAE671D7D.png|326]] #### INSPECT 面板 功能说明见下图左框。主要显示几方面：**commit 的详细信息**、**当前所在行的提交历史**、**当前文件的提交历史**。 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-9E9DD643BFD70B872AE9F46542F836B4.png|513]] ##### FILE HISTORY 栏 ⭐⭐ - **比较同一文件的不同历史版本**（注：只能看到过去历史提交的，**不能看到其他分叉分支上的**） ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-DE453D0395F728C94511E1568AD9864A.png|1050]] ##### SEARCH & COMPARE 栏 ⭐ ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-B86A91A9B0555AC04D2CB30FA3CBE251.png|762]] > [!NOTE] 支持直接将 **特定提交** 中的内容转移到 "**当前工作区**"： > > ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-2249EDDE2BCA7385B9E7C14627DC2517.png|706]] > > ^g5e0gr ### Git Blame 功能 - **在行尾显示该行代码的变更信息**：作者名、相对时间戳、commit 信息 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-B9C6867FC5B21689CBC75CEA81750889.png|637]] - **悬停时浮窗显示修改者信息**： ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-3D0954E853FF2F82C8FCBE6439E49D9F.png|435]] - **状态栏右下角同样显示上述信息** ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-17546730980C8D97E61BDE84A6A0BA0C.png|387]] ### File Annotations 功能 - 右上角按钮支持显示三项内容： ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-28CECA03B555540AB9A0EDDCD2F00BF1.png|234]] - Filt Blame：编辑页左侧显示**该文件的提交历史信息** ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-3BE67F28FD2079613AEE0FB6DF1B9804.png|569]] ### Revision Navigation 功能 ⭐ - 右上角按钮，点击弹出 diff view，**比较 "工作区"与"暂存区或 HEAD"** 差异 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-B111E23BA875E3E4470EBB2A173799BA.png|290]] ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-09273B79F617C2DA5B92868EEBCE315A.png|661]] - 按住`<Alt>` 后点击，**可选择与任意一个历史提交进行对比** ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-F31FE50200CE384F0BA348271B903611.png|419]] ### Git Codelens 功能 在**文件顶部**和**每个代码块的开头**显示**最近提交的作者信息 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-9C567F3DBDFF152FFE8A2ED0C3FDD0F7.png|998]] ### 交互式 Rebase 功能 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-0238D828E152460BC41B016AB559A165.png|475]] ### Pro 功能（付费） ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-D7BAE7AC76986CF2C4B2C395C7234F69.png|352]] <br><br> # Git History（❌） 该插件提供了以下页面，可供**查看分支历史、文件历史**，**比较不同提交&不同分支**，**比较同一文件的不同版本**。 ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-7A7C314FC9C3E4A45CA33288CBBCE397.png|712]] ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-C95987CC7E5165F03DD90AA1A547EABD.png|729]] ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-9BC03E772402249A36687EE8953E5E67.png|728]] > ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-2223367DC595F6FAB125776AB16F74D1.png|743]] <br><br><br> # Git History Diff（❌） > [Site Unreachable](https://marketplace.visualstudio.com/items?itemName=huizhou.githd) 该插件是**以一个独立页面**显示**提交历史**（分支的提交历史，涉及特定文件变更的提交历史等等） ![[_attachment/05-工具/VSCode/VSCode 配置 Git 相关插件.assets/IMG-VSCode 配置 Git 相关插件-595117384DC19B53D0779D9025619EB4.png|655]] <br><br> # 参考资料 # Footnotes [^1]: [VSCode 或许不需要 GitLensGit-Lens 中个人所需要的功能非常少，部分实用性功能还需要收费，个人场景下 - 掘金](https://juejin.cn/post/7316097536547700775)