教程:在 WebStorm 中开始使用 Git
本教程将引导您了解最常用的 Git 操作,并展示如何在 WebStorm 中执行这些操作。 您将学习如何从项目中创建 Git 版本库、在 GitHub 上共享项目、提交并推送更改、创建并合并分支、解决合并冲突,以及查看文件历史记录。
步骤 1。 创建包含 Git 版本库的新项目
在本教程中,我们将创建一个简单项目,将其共享到 GitHub,并执行以下 Git 操作。
启动 WebStorm,然后在 欢迎 屏幕上点击 新建项目。
在打开的对话框中,选择项目类型(本教程中我们只创建一个 空项目 ),为项目指定名称(例如
gitdemo),并提供位置路径。选择 创建 Git 仓库 复选框。

点击 创建。 新项目将立即在 WebStorm 中打开。
您将收到通知,说明已为项目创建了本地 Git 版本库。 此外,还会显示用于处理 Git 的专用工具窗口。

步骤 2。 将文件添加到 Git
启用 Git 集成后,WebStorm 将显示哪些文件已修改、哪些新文件已添加到 Git,以及哪些文件未被 Git 跟踪。
为了了解它的工作原理,我们将创建一个简单的 README.md 文件,并添加简要描述,然后将其添加到 Git。
在 项目 工具窗口 Alt+1 中,选择项目目录(
gitdemo)。点击工具窗口工具栏上的
,然后从列表中选择 文件。 将文件命名为
README.md。在打开的对话框中,点击 添加 ,以便 Git 可开始跟踪该文件。

现在,当您修改此文件时,WebStorm 会自动索引任何更改(换句话说,将其添加到 Git 暂存区 ),因此无需手动执行该操作。
将以下文本添加到新创建的文件中:
#Tutorial This is a tutorial where you will learn how to create Git repositories from your projects and share them on GitHub.稍后我们将使用它来学习如何解决合并冲突。
现在,新文件已由 Git 跟踪,并已添加到 更改 更改列表中,位于 提交 工具窗口 Alt+0 中。

更改 更改列表可帮助您管理尚未提交到 Git 仓库的本地更改。 详见 将更改分组到 changelist 中。
还有一个 未受版本控制的文件 更改列表,其中列出了属于项目但尚未添加到 Git 仓库中的文件。 本教程中我们不会使用它们,但您可以随时在 从版本控制中排除文件(忽略) 中了解有关未受版本控制文件的更多信息。
步骤 3。 将项目提交到本地 Git 版本库
现在让我们将所有要共享的文件添加到仓库中并进行提交,以保存它们的当前状态。
在 提交 工具窗口 Alt+0 中,选中要提交的文件旁的复选框。
为您的第一次提交输入一条消息:

单击 提交。 提交成功后,WebStorm 会通知您:

如果您尚未在计算机上使用 Git,在提交更改之前,WebStorm 会要求您输入用户名和电子邮件地址。 Git 会将此信息存储在
.git/config中,以便将您标识为提交的作者。
步骤 4。 在 GitHub 上共享您的项目
为了让其他协作者可以访问您的项目,您需要将其发布到远程仓库,例如 GitHub 或 GitLab。 WebStorm 提供了与这两个平台的集成。 详情参见 管理托管在 GitHub 上的项目 与 管理托管在 GitLab 上的项目。
在本教程中,我们将把项目发布到 GitHub。
在主菜单中,依次选择 。
在打开的对话框中,您可以修改仓库名称(默认为项目名称)、远程名称(默认为 origin)、选择仓库类型(公开或私有)并按需添加描述。
如果您尚未在 GitHub 上注册,请单击 添加账户 ,然后点击 通过 GitHub 登录。

在打开的浏览器窗口中输入您的 GitHub 凭据,或在其中创建新帐户。 返回 WebStorm 后, 共享方式 字段将显示您的账户名。
单击 共享。 项目成功发布到 GitHub 后,将显示以下通知:

单击通知中的链接,在 GitHub 上打开仓库。
步骤 5。 创建新分支
在开发新功能时,您可能需要创建单独的分支,以避免更改在未经过测试前进入主分支。
按下 Ctrl+T 以拉取当前分支的最新版本。
在打开的对话框中,指定分支名称(例如
new_feature),并选中 检出分支 复选框以立即切换到该分支。
您现在已切换到新创建的分支:

步骤 6。 进行并查看更改
向项目添加一个新文件(例如
git-features.md),当 WebStorm 提示将其添加到 Git 版本控制时,点击 添加。然后,打开
README.md文件并将其中的文本替换为新的描述:#Demo This is a demo project where you will learn how to commit and push changes, create and merge branches. Refer to `git-features.md` to check the list of Git operations.在 项目 工具窗口 Alt+1 和编辑器选项卡中,WebStorm 会用不同颜色标记文件:蓝色表示已修改,绿色表示新添加。 此外,在修改文件的标记栏区域,修改行旁会出现彩色更改标记。

若需查看具体更改内容,请单击标记栏中的更改标记:

若要在单独的编辑器选项卡中查看差异,请点击
:

转到 提交 工具窗口 Alt+0 ,以一次性预览所有更改。 双击文件以在编辑器中打开差异视图:

详见 调查 Git 仓库中的更改。
步骤 7。 提交并推送更改
在我们的 new_feature 分支中,我们新建了一个 git-features.md 文件,并修改了 README.md 文件。 让我们将更改提交并推送到远程仓库。
在 提交 工具窗口 Alt+0 中,选中两个文件旁的复选框,输入提交信息(例如
Update README.md)。输入提交信息过程中可以使用项目文件名的自动补全功能 Ctrl+Space:

单击 提交。
按 Ctrl+Shift+K 或从主菜单中选择 以将更改推送到远程版本库。 将打开 推送提交 对话框。 在此,您可以查看所有待推送的提交以及所有受影响的文件。 在推送更改之前,您可以查看每个文件的差异。 为此,请右键单击某个文件,然后选择 显示差异 或按 Ctrl+D:

点击 推送。
步骤 8。 合并分支并解决冲突
将来自一个分支的更改应用到另一个分支的方法有多种,例如合并和变基分支、cherry-pick 提交、应用独立的更改或文件。 所有这些方法均在 使用合并、变基或挑拣操作来应用更改 中详细说明。
在本教程中,您将学习如何合并两个分支。 我们还将故意制造一个合并冲突,以学习如何使用 WebStorm 的合并工具轻松解决合并冲突。
合并分支
在 Git 分支 弹窗中选择
main分支,然后点击 检出。在 第 6 步 中,我们修改了
README.md文件,所在分支为new_feature。 现在我们将在main分支中再次修改该文本,以模拟一次合并冲突,例如:#Tutorial This is a test project where you will learn how to work with the most popular Git operations.按照 第 7 步 的说明提交并推送更改。
在 Git 分支 弹窗的 本地 节点中,选择
new_feature并点击 合并 'new_feature' 到 'main'。
由于我们在不同的分支中修改了同一文件,因此会出现 冲突 对话框。

解决冲突
在 冲突 对话框中,您可以选择以下几种方式来解决冲突:
接受您的更改 以保留当前分支所做的更改。
接受对方的更改 以应用您要合并到当前分支的分支所做的更改。
合并 以在专用对话框中手动解决冲突。
点击 合并。 将打开 合并修订版本 对话框:

左侧窗格(名为 来自 main 的更改 )显示来自本地副本的只读更改。
右侧窗格(名为 来自 new_feature 的更改 )显示来自
new_feature分支的只读传入更改,我们希望将该分支合并到main。中间窗格(名为 结果 )是一个功能完备的编辑器,显示已解决冲突的结果。
在此对话框中,您可以单击
/
接受更改,单击
拒绝更改,然后在中间的 结果 窗格中输入代码。 详细信息请参阅 解决 Git 冲突。
让我们从左侧窗格的
main中接受一个更改,方法是点击。 由于我们不需要来自
new_feature的同一行更改,请点击右侧窗格中红色冲突行内的来忽略它们。
点击右侧窗格中的
,以应用来自
new_feature的其余非冲突性更改。请在中间窗格中查看合并结果。 合并后的文本应如下所示:
#Demo This is a test project where you will learn how to work with the most popular Git operations. Refer to `git-features.md` to check the list of Git operations.
点击 应用。
按下 Ctrl+Shift+K ,或从主菜单中选择 ,将这些更改推送到远程版本库。
您可以在 日志 选项卡的 Git 工具窗口 Alt+9 中查看所有分支的提交:

您还可以在此还原提交、将更改 cherry-pick 到其他分支等。详情请参阅 日志选项卡。
步骤 9。 查看历史记录
当您与其他人协同开展某个项目时,可能会有疑问,比如某个文件是为什么、何时以及如何被修改的。
在 main 分支中,打开 README.md 文件。 要查找这些更改源自哪个提交,请执行以下操作之一:
在编辑器中或在 项目 工具窗口 Alt+1 右键点击文件,并选择 。 将打开 历史记录 选项卡,该选项卡位于 Git 工具窗口中:

在此选项卡中,您可以查看影响该文件的所有提交,并找出您所关注的更改是在哪个提交中添加的。
在编辑器中,选择一个要查看历史记录的代码片段,右键点击所选内容,然后选择 。 将打开 所选内容的历史记录 窗口:

在此处,您可以查看影响所选代码的所有提交。
在 调查 Git 仓库中的更改 中查找更多探索 Git 历史的方法。
后续步骤
如果您在本教程中没有找到某些特定 Git 任务的执行方法,请参阅 Git 指南 — 其中描述了 IDE 中可用的所有 Git 操作。
如果您的项目未受 Git 管理,仍可使用 本地历史记录 功能跟踪和管理本地更改、回滚到特定文件状态、还原已删除文件等。
