如何在 Visual Studio Code 中并排查看“git diff”文件？

Question

我想知道如何在Visual Studio Code的终端中使用命令git diff master origin/master查看文件的差异。

我从远程仓库进行了git fetch，现在我想查看差异，但是该命令只会在终端中显示。

以下是我想要的示例：

- Ricardo Jesus Jarquin Perez

Answer 1

在 Visual Studio Code 中，左侧有一个 Git 图标，长这样：

点击这个图标，然后双击 Changes 下列出的任意一个文件，就可以看到两边的 Git 差异。

- Ratan Uday Kumar

---

为了完整性，因为不是每个人都有图标显示，可以在菜单视图->SCM（显示源代码控制）下查找 ctrl-shift-G。 - Out of Control

您还可以使用键盘快捷键 ⌘K V 打开预览，如 VSCode keybindings 中所述。 - Michael Behrens

图标已更新 - llobet

你的回答不能用于任何差异。这只能显示当前更改与最新提交之间的差异。 - blindguy

这个答案不应该被接受，因为它只显示了尚未提交的更改。 - O.k

Answer 2

如果您想查看来自不同分支的差异更改，需要进行一些额外的工作。例如，您想要查看在您的功能分支中最近N个提交中的所有更改。

1. 通过将以下内容添加到~/.gitconfig文件中，设置Visual Studio Code为默认difftool。

[diff]
    tool = vscode
[difftool "vscode"]
    cmd = code --wait --diff $LOCAL $REMOTE

前往你的Git项目。键入:

git difftool {{你想要检查的分支名称}}, 例如 git difftool master

对于每个文件，将提示是否要在Visual Studio Code中打开它。

- Boncho Valkov

---

在 Visual Studio Code 中，是否有一种方式可以查看所有待比较的文件列表，而不是一个一个地逐个打开（就像单击 Visual Studio 左侧面板上的 git 图标所看到的那样）？ - Sathya

相关的 VS Code 文档：https://code.visualstudio.com/docs/editor/versioncontrol#_vs-code-as-git-diff-tool - ford04

@Sathya 一旦你完成了Boncho分享的设置，应该就可以使用 git difftool --dir-diff 命令了，或者你可以在配置文件中添加别名 [alias] df = difftool --dir-diff。 - Mr.Ali

还有一个很好的视觉化代码插件“git-tree-compare”，它可以显示您与特定参考分支的差异更改。 请参见：https://marketplace.visualstudio.com/items?itemName=letmaik.git-tree-compare - ruuns

作为一次性命令，VSCode本身可以用来比较两个文件：code --diff file1.txt file2.txt。 - Ryan Norooz

将管道符号 | 和命令 code - 连用只能实现一次性使用。例如：git diff some_tag_or_branch | code - - Jacob Phillips

Answer 3

你可以在Visual Studio Code中实现这个功能，具体步骤如下：

1. 打开设置（Windows/Linux上依次点击“文件”、“首选项”、“设置”；macOS上依次点击“Code”、“首选项”、“设置”）
2. 搜索“diff”
3. 找到Diff Editor:Render Side by Side这一设置，勾选复选框即可。

- lboyel

---

你能更具体一些吗？你是如何"打开设置"的？是在左下角的“齿轮”图标吗？还是其他什么地方？请通过编辑您的答案来回复，而不是在评论中。 - Peter Mortensen

如果您有一个待处理的更新 - 尝试在更改此设置后重新启动 Visual Code。我有一个更新，只有在更新之后更改才奏效。 - StackUnder

@PeterMortensen，已经过去了将近一年，但也许有人会发现这很有帮助。无论如何，在Windows上，您按CTRL+P，然后按>，然后键入“Settings”，菜单就会滚动下来，我会寻找UI菜单选项。 - Gabrielius

@PeterMortensen CTRL+, - Giulio

这应该是我个人认为最好的答案。无论如何，这正是我正在寻找的。 - JΛYDΞV

似乎被接受的答案假定此参数已启用。 - heringer

Answer 4

经过数小时的搜索、安装和卸载扩展程序，发现 VSC 已经实现了这个功能。只需点击右上角的图标 - "打开更改"，即可查看更改。若要仅查看文件而非更改，请点击顶部右侧的图标 - "打开文件"。

请看下面的截图： 第一张： 第二张：

- adrianvintu

---

如何在一个选项卡中打开所有更改过的文件 - VityaSchel

您还可以从命令面板中选择“Git: Open Changes”。 - Ryan

Answer 5

如果您想比较两个任意引用 - 例如在分支和分支之间进行比较，或者在提交和另一个提交之间进行比较 - 并且仍然像我们看到索引更改一样轻松地查看所有文件，请按照以下步骤操作：

• 安装 GitLens 扩展
• 转到左窗格中的源代码控制。如果您没有该图标，则可以在菜单视图 -> SCM（显示源代码控制）下查找或使用定义的快捷方式。
• 展开最后一部分搜索和比较
• 单击比较参考...按钮
• 选择参考，然后您将看到更改的文件列表，并单击一个文件将显示其侧面更改。

- ehab

---

GitLens非常好用！ - Shaohua Li

Answer 6

我在这里回答过类似的问题（这里）。

但基本上您可以使用以下命令：

git difftool -x "code --wait --diff"

- Gomino

---

这是指对此问题的一个（已删除的）回答。 - Peter Mortensen

Answer 7

在 Visual Studio Code 中打开文件 ~/.gitconfig：

code  ~/.gitconfig

复制以下行到~/.gitconfig文件中:

[diff]
    tool = default-difftool
[difftool "default-difftool"]
    cmd = code --wait --diff $LOCAL $REMOTE

保存更改。通过运行 Ctrl + Shift + ` 打开 Visual Studio Code 中的终端。在终端中运行以下命令：

git difftool master origin/master

- Abdollah

Answer 8

这是一种简单的方法来查看你自上次提交以来的更改（在当前分支上）：

1. 点击 VS Code 左侧的 Git 图标
2. 如果您自上次提交以来对文件进行了更改，则会在“更改”下列出这些文件。
3. 右键单击文件名（在“更改”下），然后单击“打开更改”。
4. 这将打开两个版本的文件，并突出显示更改部分。

- billygarrison

Answer 9

现在可以使用“三个点”按钮来切换内联视图。

- rio

Answer 10

请注意，侧边对比并不总是最佳选择。

考虑一下microsoft/vscode issue 123111：允许条件性的侧边对比或内联diffEditor。

我喜欢侧边对比。我对内联对比也很满意。
我不喜欢的是在狭窄的编辑器窗口中查看侧边对比：

这个问题已经通过PR 189304解决，并且已经包含在VSCode 1.82中（2023年8月）。

动态布局

如果差异编辑器的宽度太小，编辑器会自动切换到内联视图。
如果编辑器再次足够宽，之前的布局将恢复。

设置 "diffEditor.useInlineViewWhenSpaceIsLimited": false 来禁用此行为。

- VonC

---

diffEditor.useInlineViewWhenSpaceIsLimited": false对我很有帮助！ - undefined

这是在新的更新之后发生的。现在我可以在并排文件中查看更改。非常感谢 :) - undefined

救了我的一天，我在想这到底是怎么回事。 - undefined