了解如何下载 Git 并将其与 Dreamweaver CC 结合使用。

优质
小牛编辑
151浏览
2023-12-01
阅读本文,了解如何在 Dreamweaver CC 中使用 Git 管理文件和源代码。

Dreamweaver CC 支持使用 Git(一个开源的分布式版本控制系统)管理源代码。使用 Dreamweaver 中的 Git 集成,您可以先在任何位置单独处理代码,之后再将您的更改合并到 Git 中央存储库。Git 会持续跟踪文件中的各项修改,而且允许您恢复到之前的版本。

使用 Git,您可以轻松地创建和维护分支,故而在您开展团队协作时,Git 存储库也很有帮助。例如,如果您是一位想要处理站点设计更改的设计人员,而另一个团队成员需要处理同一站点的更改请求,则您二位都可以独立地使用 Git 进行工作。在这种情况下,您二位可以各自独立地在本地存储库中创建分支并进行更改。本地存储库包含您对源做出的所有更改的完整历史记录。利用中央存储库,您随时可以暂停和合并更改。合并可确保中央存储库始终具有包含您二位所做更改的最新代码。

继续阅读,了解如何开始在 Dreamweaver 中使用 Git。

开始在 Dreamweaver 中使用 Git

如果您是新的 Git 用户,您必须先下载 Git 客户端并创建 Git 帐户。如需在 Dreamweaver 中使用 Git,Git 客户端必不可少。

如果您已经拥有 Git 帐户,请登录您的帐户。确保您已下载 Git 客户端并将其安装到您的系统上。 

通过以下步骤开始在 Dreamweaver 中使用 Git:

  1. 下载适用于您的操作系统的 Git 客户端。
  2. 为您的 Git 客户端创建帐户。

    如果您已经拥有 Git 帐户,请提供您的凭据,并登录您的 Git 客户端。

建议您使用默认配置设置来安装 Git 客户端。随后,Dreamweaver 会自动拾取可执行文件的路径。

您现可启动 Dreamweaver 并将您的站点与 Git 存储库关联。

Git 面板

您可以通过 Dreamweaver 的 Git 面板(“Windows”>“Git”)进行 Git 操作。作为 Dreamweaver 用户,您可以使用此面板执行常见的 Git 操作,例如提交、推送、提取、获取等。

注意:只有在将 Git 客户端下载到您的计算机中后,您才可以在 Dreamweaver 中查看此面板。

Dreamweaver 中的 Git 面板
A. 提交 B. 获取所有远程并刷新计数器 C. Git 提取 D. Git 推送 E. 显示存储库历史记录 F. 显示文件历史记录 G. 创建标签 H. 打开 Bash/终端控制台 I. 更多操作 J. 搜索 K. Diff L. 恢复文件 

将您的站点与 Git 关联

如需在 Dreamweaver 中使用 Git,您必须先将 Dreamweaver 站点与 Git 存储库关联。Git 存储库类似于您创建的用来帮助您跟踪文件更改的文件夹。您的计算机上可以有任意数量的 Git 存储库。您的系统中的每个存储库都是独立的。也就是说,保存在一个 Git 存储库中的更改不会影响其他存储库中的内容。

您可以通过创建新的存储库或从现有存储库克隆,将您的网站与存储库关联。初始化或创建新存储库时,系统会在您当前的工作目录中创建一个空的 Git 存储库,且会在该文件夹中创建一个 .gitignore 文件。

但是,当您克隆现有 Git 存储库时,系统会将您的父存储库中的所有文件克隆到您的本地系统。

继续阅读,了解如何初始化 Git 存储库或克隆存储库。

初始化 Git 存储库

当您开始在 Dreamweaver 中使用 Git 时,您可能希望先创建一个新存储库。为您的站点初始化 Git 存储库时,您创建一个新 Git 存储库,在其中可添加与您的 Dreamweaver 站点关联的文件。

  1. 作为 Dreamweaver 用户,您可以从新站点开始,或者您可能要将一个现有站点与 Git 存储库关联。无论采用哪种方法,都请按照以下过程来初始化 Git 存储库。

    • 要关联新 Dreamweaver 站点,请单击“站点”>“新建站点”。
    • 要关联现有的 Dreamweaver 站点,请单击“站点”>“管理站点”。在“管理站点”对话框中,双击您要与 Git 存储库关联的站点。
  2. 如果您要创建新站点,请为该站点指定名称。

    如果您有包含与您站点相关的文件的文件夹,则需从“本地站点文件夹”字段指向该文件夹。

    指定新 Dreamweaver 站点的名称和文件夹位置。

    如果您要将您的新站点与现有的 Git 存储库相关联,请确保“本地站点文件夹”指向相应的 Git 存储库。

  3. 选中“将 Git 存储库与此站点关联”复选框。然后,选择“初始化为 Git 存储库”选项。

    初始化新 Dreamweaver 站点的 Git 存储库
  4. 单击“保存”。

    请注意,您本地文件夹中的文件现已可在“文件”面板(Git 视图)中显示。这些文件处于未跟踪状态。即,这些文件尚未提交到您的 Git 存储库。

    您可以继续处理您的文件并在稍后提交这些文件,或者打开 Git 面板 (Windows > Git) 并将您的文件提交到您的存储库。要了解如何在 Git 中提交文件,请参阅跟踪和提交更改。

克隆现有存储库

如果您已在使用托管于 Github、Bitbucket 或其他常用托管服务上的现有 Git 存储库,则您可以通过执行以下步骤来从 Dreamweaver 中克隆该存储库。克隆现有存储库时,您会在本地系统中创建一个目标存储库的副本。

  1. 单击“站点”>“新建站点”。
  2. 在“站点设置”对话框中,选中“将 Git 存储库与此站点关联”复选框。然后,选择“使用 URL 克隆现有 Git 存储库”。
  3. 输入要克隆的存储库的 URL。

    确保输入的目标存储库的 https URL 有效。如需测试该 URL 是否有效,请单击此对话框中的“测试”按钮。在进行克隆和执行 Git 获取或提取等操作时,无效的 URL 会引发错误。

    在 Dreamweaver 中克隆 Git 存储库

    注意:Dreamweaver 中目前不支持使用带密码短语的 SSH 密钥克隆 URL。用户名和密码字段处于禁用状态。

  4. 如需保存您输入的凭据,请选中“保存凭据”复选框。这样,您就不必在每次执行 Git 推送或提取等远程操作时重新输入凭据。
  5. 单击“保存”。

    克隆存储库后,系统会为源存储库创建一个本地副本。您可以在 Dreamweaver 中查看和编辑本地文件。

    克隆的原始存储库快照会在右上角的“Git 面板”>“源”中显示。

    注意 Git 面板中的源存储库

使用 Git 进行版本控制

现在您已将 Dreamweaver 站点与 Git 存储库相关联,因此您可以从“文件”面板(Git 视图)中查看 Git 中的文件。Git 会将本地存储库中的文件划分为以下几类:

  • 未跟踪的文件:您尚未提交到 Git 存储库的文件。初始化 Git 存储库之后,文件会处于未跟踪状态,直到您提交这些文件为止。
  • 未修改的文件:未经修改的文件。
  • 经过修改的文件:经过编辑的文件。
  • 已暂存的文件:经过修改并已准备好进行提交的文件。

使用 Git,您可以跟踪文件的修改情况。在本地系统中修改文件后,经过修改的文件会以不同的颜色在“文件”面板中显示。在代码视图中双击并打开文件时,您还可以在经过修改的行旁边看到装订线标记。您可以在 Git 中继续进行操作并提交经过修改的文件,从而同步更改。

当您提交文件时,Git 允许您为每次提交输入日志消息并使用 diff 功能查看更改。您还可以查看每个文件及整个存储库的版本历史记录。

继续阅读,了解如何跟踪您在 Dreamweaver 中的编辑并在 Git 中提交更改。

在 Git 中跟踪编辑情况

在 Dreamweaver 的“文件”面板中,注意 Git 图标,此图标让您可以在 FTP 视图与 Git 视图之间切换。单击 Git 图标可切换 Git 视图。

如果您已初始化 Git 存储库但未提交您的文件,则这些文件仍会处于未跟踪状态。但是,如果您已在初始化存储库后提交了您的文件,则 Git 会识别出这些文件。

在“文件”面板中查看未跟踪的文件查看 Git 识别出的已提交的文件

如果您已从其他存储库克隆了所有文件,则 Git 会重新识别这些文件。

修改文件并单击“保存”后,“文件”面板会以不同的颜色显示经过修改的文件。双击经过修改的文件,即可在代码视图中查看具体更改。

注意代码视图中的装订线标记

装订线标记表示的是那些包含更改的行。绿色装订线标记表示的是添加的新代码。黄色装订线标记表示的是经过修改的代码,而红色装订线标记表示的是已被删除的代码行。

通过查看装订线标记,您可以查看代码更改

当您单击黄色装订线标记时,该应用程序会将已删除的代码行显示为红色,将您新添加的代码显示为绿色。

请留意已删除的代码行左角的 R 符号。单击此 R 符号可将已删除的代码添回您的文件中。

单击 R 符号可添加已删除的代码

使用装订线标记可在将更改提交至 Git 存储库之前查看 diff 并检查更改。

查看经过修改的文件的 diff

打开 Git 面板时,您可以看到经过修改的文件的列表。您可以单击此列表中的一个文件,并查看在上一次提交之后对该文件做出的更改 (diff)。要查看某一文件的 diff,请从 Git 面板执行以下操作之一:

  • 单击各个文件即可查看所做的编辑。红色高亮部分指明之前的版本,而绿色高亮部分则指明您做出的更改。
  • 选择您要查看 diff 的文件。单击 (Diff 图标)。随即会显示“Git Diff”对话框,其中包含以红色和绿色突出显示的更改。
查看经过修改的文件的 diff

提交更改

如需记录本地存储库中的所有更改,您需要提交在文件中做出的更改。在 Git 中提交更改:
  1. 在 Git 面板中,选择您要提交的一个或多个文件。

    提交对本地 Git 存储库做出的更改
  2. 单击 (“提交”图标)。

    单击“提交”后,系统会显示“Git 提交”对话框。此对话框会显示存在修改的文件。

    在继续“提交”文件之前,您可以通过单击各个文件查看更改。

  3. 如需提交文件,请在消息框中输入提交消息,然后单击“确定”。

    提交文件后,系统会在 Git 面板中清除这些文件。

    在 Git 中提交您的更改

恢复更改

如果您已提交更改但希望将文件恢复为之前的版本,请执行以下操作:

  1. 在 Git 面板中,选择您要恢复的一个或多个文件。
  2. 单击 Git 面板中的三明治图标,然后选择“恢复自上次提交后所做的更改”。

    这些文件会在您的本地存储库中恢复为之前的版本。您可以在“文件”面板中查看经过恢复的文件。

    在提交文件后恢复更改

    注意:您必须至少将文件提交两次,才能在提交后恢复该文件。

  3. 如需在提交之前恢复更改,执行以下步骤:

    如果您希望在提交文件前保留上一个已提交版本的文件:

    1. 打开 Git 面板。
    2. 选择要保留的文件,然后单击“刷新”图标。
    3. 在确认对话框中,单击“确定”。

    您选定的文件将从已修改文件列表中清除,并且将会恢复之前版本的文件。

    在提交更改之前恢复文件

创建标签

每当您在 Git 中提交更改时,就可以创建标签。您可以使用标签标记重要的提交。例如,标记根据客户要求做出的重要更改。这些标签将充当特定提交的标识。

  1. 如需创建标签,请在 Git 面板中单击 (“创建标签”图标)。
  2. 在“创建标签”对话框中,为标签指定名称。单击“确定”。

    为您的提交创建标签

    您创建的标签将已与您的提交关联。

    如果您在执行提交后创建了一个标签,该标签将自动与您的最新提交相关联。

查看文件历史

每次在 Git 中提交文件时,您都可以查看文件的历史记录以及提交的详细信息。此功能有助于识别重要的提交以及与提交关联的标签。

  1. 在 Git 面板中,执行下列操作之一:
  • 选择所需文件,然后单击 (“显示文件历史记录”图标)。
  • 在“文件”面板中右键单击文件,然后选择“文件历史记录”。

系统将显示所选文件的“Git 文件历史记录”。您还可以在同一对话框中查看有关此文件提交的详细信息。

在 Git 中查看文件历史记录

查看存储库历史记录

除了在 Git 中查看文件的历史记录,您还可以查看在存储库级别所做的更改。您可以查看在存储库级别所做的所有更改和提交。要查看存储库历史记录,请执行以下步骤:

  1. 在 Git 面板中单击“显示存储库历史记录”图标。系统将显示包含所有提交的详细信息的 Git 存储库历史记录。
  2. 您可以查看提交消息、文件的提交日期和时间、与提交关联的标签以及提交文件的用户的详细信息。
  3. 存储库历史记录通常会载明在存储库级别提交的文件列表。您可以单击各个文件以在文件级别查看更改历史记录。

使用 Git 进行协作

分支是 Git 的最为独特的功能之一。与大多数版本控制系统不同,您可以将 Git 分支视作独立于所有关联文件或代码的条目。默认情况下,您的存储库中存在一个名为“master”的分支。master 分支是主分支或曰起决定作用的分支。您可以从 master 中创建分支,并在每个分支中进行编辑。

您还可以从其他分支创建分支,此时您会创建一个父分支的副本。您可以在同一 Git 存储库内的两个不同分支上独立地处理工作。例如,您可以在一个分支上处理站点的新增功能,同时在另一个分支中处理部分更改请求。

使用 Git,您还合并分支 - 您可以将当前分支中的更改合并到某一目标分支。在您将两个分支合并后,这两个分支会继续独立存在。您可以继续使用父分支和目标分支。

在 Dreamweaver 中,当多位开发人员和设计人员共同处理一个站点时,每位用户都可以从 master 中创建分支并单独进行更改。需要时,他们可以轻松地将其更改与其他分支合并,然后继续同时使用两个分支。

要了解有关在 Git 中创建和管理分支的更多信息,请阅读以下部分:

在 Git 中创建分支

  1. 在“文件”面板中,选择列出了所有分支的下拉列表。
  2. 单击“管理分支”。

    在 Git 中创建分支
  3. 在“管理分支”对话框中,单击左下角的加号 (+)。

    单击“管理分支”对话框底部的加号
  4. 在“新建分支”对话框中,选择要从中制作副本的原始分支。

    如果它是您要创建的第一个分支,那么原始分支便是您的 master 分支。

    选择原始分支
  5. 在“分支名称”字段中,为新分支指定名称。
  6. 单击“确定”。

合并分支

  1. 在“文件”面板中,选择列出了您所有分支的下拉列表。
  2. 单击“管理分支”。在“管理分支”对话框中,选择要合并的分支。
  3. 单击对话框底部的 (“合并分支”图标)。
  4. 在“合并分支”对话框中,选择目标分支。此分支是要与您的分支合并的目标存储库。

    或者,也可以指定与此合并关联的消息。

  5. 单击“确定”以将您的分支与目标分支合并。

    在 Git 中合并分支

    如果来自某一提交的文件更改与来自另一分支的更改之间存在冲突,合并流程将会暂停。系统会显示冲突消息,并显示引发冲突的文件。

    Git 面板还会显示存在冲突的文件。请注意指示存在冲突的图标。

    包含在合并过程中存在冲突的文件的 Git 面板

    如需继续合并,您必须使用“衍合”选项解决冲突,或使用无快进选项继续合并。

  6. 如果遇到合并冲突,请选择下列选项之一:

    • 使用衍合:如果选择衍合选项,您的当前更改将应用于目标分支中的冲突。在选择衍合并单击“确定”后,请打开 Git 面板,查看尚未提交的文件。随后,您可以中止衍合或重新启动衍合。中止衍合后,衍合操作将会停止且目标分支不会应用任何更改。重新启动衍合后,您的更改将跳过在目标分支中发现的冲突。
    • 即使在合并作为快进进行解析时,仍创建一个合并提交:即使您的分支和目标分支之间存在冲突,您也可以合并提交。在这种情况下,合并是强制执行的,同时将使用您的更改覆盖目标分支中的更改。

    要了解有关 Git 中的衍合的更多信息,请参阅 Git 衍合。

使用远程存储库

Git 中的远程存储库是在其他网络中托管的项目的版本。您可以通过创建与远程存储库的连接来访问存储库。根据在远程存储库中指定的访问权限,您可以具有对该存储库的只读访问权限或写入访问权限。

当您在开展团队协作时,远程存储库可帮助您在其他存储库中推送和提取数据。在 Dreamweaver Git 面板中,您可以创建远程连接、执行多项 Git 操作,如获取、Git 推送、Git 提取和远程刷新。

阅读以下步骤,了解如何创建和管理远程存储库。

添加远程存储库

您可以通过添加一个远程存储库来共享文件、工作进度以及访问在其他网络中托管的项目文件。通过添加远程存储库,您可以与目标存储库建立远程连接。利用 Dreamweaver,您可以从 Git 面板创建远程存储库。

在添加远程存储库之前,请确保另一存储库已启用公开设置。

  1. 在 Git 面板中,单击“创建远程”。
  2. 指定远程存储库的名称。
  3. 输入远程存储库的 URL 和登录凭据。

    如需确保您在添加远程存储库时输入的是有效的 URL,请在输入 URL 后单击“测试”。单击“测试”后,系统会测试 URL 的有效性。

    此测试不适用于验证凭据。

    添加远程存储库

    注意:

    如果未输入有效的 URL 或凭据,您会在执行 Git 提取、Git 推送、获取等操作时遇到错误。

  4. 单击“确定”。

    在添加远程存储库时,您会在 Git 面板顶部的下拉列表中看到该存储库。您还可以查看用于执行 Git 推送、Git 提取、获取远程和刷新计数器的多个图标。

    在 Git 中添加远程存储库

管理远程存储库

在添加远程存储库并建立连接之后,您可以从远程存储库中获取文件并将其提取到您的本地存储库。您还可以将文件推送到远程存储库。但是,您在首次执行 Git 推送操作之前必须先从远程存储库中获取文件。

在尝试推送文件之前,请记住在本地存储库中提交您的所有文件。如果您的本地存储库包含暂存文件,则 Git 推送操作仍然不会成功。 

您可以在 Dreamweaver 中执行以下 Git 操作:

全部获取

单击  可获取所有远程连接中的所有文件。建议您在执行 Git 推送或 Git 提取操作前先执行 Git 获取操作。此操作仅从远程获取文件且不会修改您的本地存储库。

从远程存储库中提取文件

您可以从单个存储库或一组存储库中提取更改。单击“Git 提取”图标后,系统会显示“Git 提取”对话框,其中包含多个选项。

  1. 在 Git 面板中,单击 (“Git 提取”图标)可从远程存储库中提取经过修改的文件并将这些更改与您的本地存储库合并。
  2. 在“Git 提取”对话框中,选择跟踪分支,指定是要从当前分支中提取更改还是从其他分支中提取更改,然后设置提取设置。

    从远程存储库执行 Git 提取
  3. 默认情况下,将选择“默认”合并。在这种情况下,来自远程的文件将提取到您的本地存储库中,并且更改将合并到您的本地。
  4. 您也可以选择下列选项之一:

    • 避免手动合并:选择此选项可禁止手动合并文件。
    • 合并但不提交:选择此选项后,即使已暂存的文件并未提交,也会继续合并到远程存储库。
    • 使用衍合:选择此选项可执行衍合。使用衍合时,系统会在您正从中提取文件的分支的历史记录中抓取并应用当前分支中的更改。系统会重写您的分支最后提交的历史记录,这样文件便会与您正从中提取文件的目标分支中的版本相匹配。尽管衍合会为您的分支生成整洁的 Git 历史记录,但在选择“使用衍合”选项时,您必须格外谨慎。
    • 使用软重置:选择此选项可执行重置或软衍合。首次从远程存储库中提取文件时,您可以选择“使用软重置”选项。。在这种情况下,远程存储库将充当父存储库,且本地存储库会从中接收所有更改。但是,系统会保留本地存储库中的更改。Git 无法识别远程存储库中不存在、但位于本地存储库中的文件。执行软重置后,这些文件将显示为已删除的文件。如果您选择在本地存储库中保留这些文件,那么远程更改将会丢失。

    注意:

    如果继续进行软重置,无法识别的文件将被删除。

将文件推送到远程存储库

与远程存储库连接后,当您修改并提交经过修改的文件时,Git 会记录这些更改。Git 面板中的 Git“推送”图标 会立即显示经过修改的文件的数量。这些文件现可推送到远程存储库。

在执行 Git 推送操作时,您对本地存储库所做的提交将推送到远程存储库。

在 Dreamweaver 中推送文件:

  1. 在 Git 面板中,单击“Git 推送”图标。

    系统将显示“Git 推送”对话框。您可以将提交推送到当前跟踪分支或指定的其他分支。

    将本地提交推送到远程 Git 存储库
  2. 您还可以在此对话框中设置推送设置。默认情况下会选择“默认推送”选项。
  3. 您也可以选择以下选项:

    • 强制推送:选择此选项可将更改强制推送到远程存储库,且不考虑可能存在的冲突。
    • 删除远程分支:选择此选项可删除现有远程分支并将本地文件推送到远程存储库。
  4. 您可以选择是否选中“发送标签”复选框(选中后,会将标签推送到远程存储库)。
  5. 单击“确定”。

    如果本地提交与对远程存储库执行的提交之间存在冲突,建议先解决全部冲突,然后再推送更改。 

    在这种情况下,您必须先从远程存储库中提取更改,解决冲突,然后再推送没有任何冲突的文件。

在 Git 面板中搜索文件

利用 Git 面板中的“搜索”栏,您可以使用文件名搜索文件。当您有大量与您的站点关联的文件时,此功能特别有用。

如需搜索文件,只需在“搜索”栏中键入相应文件名即可。系统会立即显示包含您的搜索查询的一个或多个文件。

将文件添加到忽略列表

如果您不想让 Git 对某个文件执行操作,您可以将该文件添加到 .gitignore。然后,当您执行任何操作(包括提交、推送和提取)时,Git 都会忽略此文件夹中的文件。您必须将 .gitignore 文件提交到您的存储库,以便让克隆您的存储库的任何其他用户也注意到 .gitignore 文件夹中的文件。

要将文件添加到 .gitignore,请转到 Dreamweaver 中的“文件”面板。选择并右键单击您希望 Git 忽略的文件,然后选择“Git”>“添加到 .gitignore”。

将文件添加到 .gitignore

在任何时候,如果您要从 .gitignore 中删除某个文件,请从“文件”面板中选择该文件。右键单击并选择“Git”>“从 .gitignore 中删除”。

确保在修改 .gitignore 文件后将此文件提交到本地和远程存储库。

通过命令行访问 Git

在本文的前面章节中,您学习了如何使用 Git 面板 (UI) 执行任务,例如将 Git 存储库与您的站点相关联、创建和管理远程连接、将文件推送到存储库或从存储库中提取文件。您还可以使用 git 命令来执行这些操作以及其他操作。

要使用终端执行任何 Git 操作,请执行以下操作之一:

  • 单击“窗口”>“Git”,然后单击“打开 Bash/终端控制台”图标。
  • 在“文件”面板中,切换 Git 视图。单击存储库下拉列表旁边的“打开 Git 终端”图标。

要查看常见的 git 命令,请参阅 Git 速查表。

注意:某些操作(例如 git 暂存和推送后组合提交)目前只能从命令行执行。

当您在命令行中执行某些操作(例如初始化 Git 存储库)时,Dreamweaver 界面中也会体现这些操作。

但如果您在 Dreamweaver 应用程序未打开时使用命令行修改文件,您会在下一次启动 Dreamweaver 时看到以下消息:

当使用 CLI 修改文件时的消息

在 Dreamweaver 中设置 Git 首选项

Dreamweaver 中的 Git 首选项可让您定义在 Dreamweaver 中使用 Git 的一些设置。您可以使用“首选项”对话框来设置 Git 首选项,如终端的路径、超时设置等。

  1. 选择“编辑”>“首选项”。
  2. 在“首选项”对话框中,选择“Git”。
  3. 在“Git 首选项”对话框中,设置以下内容:

    • Git 可执行文件的路径:您的 Git 客户端的 .exe 文件。如果您的可执行文件保存在其他位置,请浏览到您保存 Git .exe 文件的位置。
    • 默认 Git 操作超时时间:指定任何远程 Git 操作的超时时间(以秒为单位)。
    • 终端的路径:可执行文件用于打开和使用 Git 终端的完整路径。
    • 命令参数:为您的 Git 命令提供命令参数(如果有)。
    在 Dreamweaver 中设置 Git 的首选项
  4. 单击“应用”保存您的设置。

注意:重新启动 Dreamweaver,以使经过更新的首选项生效。