Aptana-Studio-初学者指南-全-

Aptana Studio 初学者指南（全）

原文：zh.annas-archive.org/md5/0425f1f5f4aeb338c6b2606089a042bc

译者：飞龙

协议：CC BY-NC-SA 4.0

前言

Aptana Studio 是一个功能强大的开源集成开发环境（IDE），专注于构建 Web 应用程序。Aptana Studio 自 2008 年以来一直存在。它通过插件提供对 HTML、CSS、JavaScript、Ruby、Rails、PHP、Python 等多种语言的支持。自 3.0.4 版本以来，Aptana Studio 的开发团队已经集成了最新的 HTML5 和 CSS3 规范。这使得大多数现代浏览器的能力可以用于 Aptana Studio 的开发。最新版本已被下载超过 600 万次。

Aptana Studio 还包括其他任务，如 FTP 和 Git 集成、JavaScript 库和 JavaScript 调试。此外，还包括专门用于处理 AJAX 应用程序和网站的 Aptana Jaxer Web 服务器。

Aptana Studio 基于 Java 平台的 Eclipse，因此它是一个跨平台软件，可以在常见的操作系统上运行，如 Linux、Mac OS-X 和 Windows。

提示

什么是 Eclipse SDK？

Eclipse 软件开发工具包（SDK）是一个完全用 Java 编写的开源项目，由 IBM 公司于 2001 年启动。

由于 Aptana Studio 基于 Eclipse，因此可以将其作为 Eclipse 插件或独立版本安装。已经使用过 Eclipse IDE 的经验用户可以在现有的 Eclipse 安装中集成 Eclipse 插件。经验较少的用户可以安装独立版本，因为它可以在没有 Eclipse 安装的情况下运行。

但为什么 Aptana Studio 适合 Web 开发？

Aptana Studio 允许您使用单一环境开发和测试您的整个 Web 应用程序。

Aptana Studio 的一些核心功能如下：

• HTML、CSS、JavaScript 等的代码辅助。它还支持最新的 HTML5 和 CSS3 规范，并包含有关主要网络浏览器中支持级别的信息。

• JavaScript 调试器集成。

• FTP、SFTP 和 FTPS 集成为您提供了远程开发的可能性。

• Git 集成使您能够使用 Git 源代码控制来管理您的项目。

让我们看看使用 Aptana Studio 进行 Web 开发有多简单。

本书涵盖的内容

第一章，入门，向您展示如何将完全可操作的 Aptana Studio 版本安装到您的系统上，如何执行系统更新或集成新插件。到本章结束时，您的 Aptana Studio 版本应该完全可用。

第二章，基础知识和如何使用视角和视图，讨论了 Aptana Studio 的基本功能，以及如何使用视角和视图。到本章结束时，您应该能够根据您的需求修改 Aptana Studio 的外观以进行优化。

第三章，使用工作空间和项目，主要关于在项目中创建和配置你的源代码，并将这些项目分组到有用的工作空间中。

第四章，调试 JavaScript，教你如何调试你的 JavaScript 应用程序，以及如何尽可能快地找到错误。

第五章，代码文档和内容辅助，展示了如何以最佳方式记录你的代码，以便每个开发团队成员都能理解功能，并且 Aptana Studio 构建器能够从你的源代码中读取更多信息。

第六章，使用 Firebug 检查代码，探讨了如何检查你的源代码，并帮助你理解为什么你的 Web 应用程序看起来和表现是这样的。

第七章，使用 JavaScript 库，提供了如何将 jQuery 或 Dojo 工具包等 JavaScript 库集成到项目中的详细指南。

第八章，通过 FTP 远程工作，指导你如何在 Web 服务器上远程使用 FTP。

第九章，使用 SVN 和 Git 进行协作工作，帮助你了解如何使用 Aptana Studio 与 Subversion 或 GitHub 一起，与你的开发团队一起开发大型项目。

第十章，PHP 项目，教你如何创建和配置 PHP 项目，以开发你的 Web 应用程序的后端。

第十一章，优化工作和提高协作，探讨了优化工作流程的各种可能性。

第十二章，故障排除，讨论了开发人员在开发过程中使用 Aptana Studio 时遇到的最常见问题。

阅读本书所需的条件

本书的所有章节都在以下软件设置上进行了测试和验证：

• Ubuntu/Debian/LinuxMint Linux，带有 3.0.x 内核和 Gnome3.2

• Aptana Studio 3.0.6（本书从这里开始，并逐步通过版本升级到 Aptana Studio 3.3.1）

因此，你需要的只是带有互联网连接的工作站来下载 Aptana Studio 安装包，以及部署你的 Web 应用程序，或者通过 FTP、SVN 或 Git 远程工作。

如果你使用的是 Apple 或 Windows 操作系统，不要害怕。整个系统在不同操作系统上看起来都一样，但操作系统之间的 GUI 元素可能略有不同。

本书面向的对象

本书是 Aptana Studio 初学者和经验丰富的 Web 开发者的完美入门指南。

如果您已经对 Aptana Studio 或 Eclipse IDE 有些熟悉，这本书将帮助您了解 Aptana Studio 如何优化您在大型 Web 应用程序和项目上的日常工作。

总而言之，这本书是配置整个开发环境的完整指南，以获得您工作的最佳效果。

约定

在本书中，您将找到许多不同风格的文本，以区分不同类型的信息。以下是一些这些样式的示例及其含义的解释。

文本中的代码词如下所示：“我们可以通过使用include指令来包含其他上下文。”

代码块应如下设置：

function someLoopWithinAFunction(loopEnd) {
    var someResult = 0;
    for(var i=0 ; i<loopEnd ; i++) {
        someResult += i;
        aptana.log("i: " +i); // Add a breakpoint here
    }
    return someResults)

任何命令行输入或输出都应如下所示：

sudo rm -r /opt/Aptana\ Studio\3

新术语和重要词汇将以粗体显示。你在屏幕上看到的，例如在菜单或对话框中的文字，将以如下方式显示：“点击下一个按钮将您带到下一屏幕”。

注意

警告或重要注意事项将以如下框中的方式显示。

提示

技巧和窍门将以如下方式显示。

读者反馈

我们始终欢迎读者的反馈。请告诉我们您对这本书的看法——您喜欢什么或可能不喜欢什么。读者的反馈对我们开发您真正能从中受益的标题非常重要。

要发送给我们一般性的反馈，只需发送电子邮件到<feedback@packtpub.com>，并在您的邮件主题中提及书名。

如果您在某个主题上具有专业知识，并且您对撰写或为书籍做出贡献感兴趣，请参阅我们的作者指南www.packtpub.com/authors。

客户支持

现在，您已经成为 Packt 图书的骄傲拥有者，我们有许多事情可以帮助您从您的购买中获得最大收益。

下载示例代码

您可以从您在www.packtpub.com的账户下载您购买的所有 Packt 图书的示例代码文件。如果您在其他地方购买了这本书，您可以访问www.packtpub.com/support，注册以直接将文件通过电子邮件发送给您。

勘误表

尽管我们已经尽一切努力确保我们内容的准确性，但错误仍然可能发生。如果您在我们的书中发现错误——可能是文本或代码中的错误——如果您能向我们报告这一点，我们将不胜感激。通过这样做，您可以节省其他读者的挫败感，并帮助我们改进本书的后续版本。如果您发现任何勘误，请通过访问www.packtpub.com/support，选择您的书籍，点击勘误提交表链接，并输入您的勘误详情来报告它们。一旦您的勘误得到验证，您的提交将被接受，勘误将被上传到我们的网站，或添加到该标题的勘误表部分下的现有勘误列表中。

盗版

在互联网上，版权材料的盗版是一个跨所有媒体的持续问题。在 Packt，我们非常重视我们版权和许可证的保护。如果您在互联网上发现我们作品的任何非法副本，无论形式如何，请立即提供位置地址或网站名称，以便我们可以追究补救措施。

请通过 <copyright@packtpub.com> 联系我们，并提供涉嫌盗版材料的链接。

我们感谢您在保护我们作者以及为我们提供有价值内容方面的帮助。

问题

如果您在本书的任何方面遇到问题，可以通过 <questions@packtpub.com> 联系我们，我们将尽力解决。

第一章. 入门

Aptana Studio 3 基于知名的 Java 集成开发环境 Eclipse；这意味着可以将 Aptana Studio 作为 Eclipse 插件或作为独立版本安装。在本入门指南中，我们将使用独立版本，因为它安装起来更容易，而且可以立即使用。

在本章中，我们将涵盖：

• 系统要求

• 从哪里获取 Aptana Studio

• 在您的系统上安装 Aptana Studio

• 如何增加 Java 的内存

• 保持 Aptana Studio 更新

• 安装第三方插件

• 卸载 Aptana Studio

系统要求

Aptana Studio 支持以下常见操作系统的 32 位和 64 位架构：

• Linux: x86 架构，GTK 窗口系统

• Mac OS: OS X/Intel 架构，OS X 10.5 或更高版本

• Windows: x86 架构

最小要求：

• Linux: 1 GB RAM，奔腾 4 级处理器

• Mac OS: 1 GB RAM，G5 或基于 Intel 的机器

• Windows: 1 GB RAM，奔腾 4 级处理器

对于较大的项目和工作区，建议使用更好的硬件。

Aptana Studio 需要你在 Mac OS-X 或 Linux 系统上安装 Sun/Oracle Java 运行时环境 JRE 1.5.x（注意，OpenJDK 尚不支持）。Windows 安装程序包含兼容版本的 Java。

下载和安装 Aptana Studio

首先，我们必须下载当前版本的 Aptana Studio。本节将教您如何完成此操作。

小贴士

下载示例代码

您可以从您在 www.packtpub.com 购买的所有 Packt 书籍的账户中下载示例代码文件。如果您在其他地方购买了此书，您可以访问 www.packtpub.com/support 并注册，以便将文件直接通过电子邮件发送给您。

操作时间 - 在 Linux 上下载和安装 Aptana Studio

1. 为了下载当前版本的 Aptana Studio，请导航到 Aptana 主页 www.aptana.com/products/studio3/download。

2. 简单选择您的系统环境，然后在网站上下载 Aptana Studio 软件包到您的 ~/Downloads 文件夹。您也可以通过命令行上的 wget 快速完成此操作（只需将 *version* 替换为您使用的版本），如下所示：

   wget http://download.aptana.com/studio3/standalone/*version*/linux/Aptana_Studio_3_Setup_Linux_x86_64_*version*.zip -P ~/Downloads
   

3. 下载完 Aptana Studio 软件包后，我们只需将其解压。为此，我们使用 unzip 命令，该命令还将解压的文件重定向到 /opt 文件夹。

   sudo unzip ./Aptana_Studio_3_Setup_Linux_x86_64_*version*.zip -d /opt/
   

   小贴士

   为什么要在 /opt 文件夹中安装 Aptana？

   /opt 文件夹是为操作系统默认安装之外的软件和附加包保留的。例如，在 Linux Mint 中，Adobe Reader、Google Chrome 和一些其他软件包通常在这里找到。

4. 我们只需创建一个符号链接，这样我们就可以在命令行上不输入完整路径即可启动 Aptana Studio。

   sudo ln -s /opt/Aptana\ Studio\ 3/AptanaStudio3 /usr/bin/AptanaStudio3
   

5. 最后，你必须更改安装文件的拥有者或组；这将允许 Aptana Studio 修改其文件并执行更新。

   sudo chown thomas:thomas ./Aptana\ Studio\ 3 -R
   

6. 现在，你只需在命令行上执行以下指令即可启动 Aptana Studio：

   AptanaStudio3
   

发生了什么？

我们在基于 Linux 的操作系统上安装了 Aptana Studio。

在 Windows 上安装 Aptana Studio 要容易得多；你只需遵循 Windows 安装程序。

动手实践 – 在 Windows 上下载和安装 Aptana Studio

1. 为了下载 Aptana Studio 的当前版本，请导航到 Aptana 主页www.aptana.com/products/studio3/download。

2. 简单地在网站上选择你的系统环境，并将 Aptana Studio 包下载到你的工作站上。

3. 双击下载的.exe文件以启动安装过程。

4. 现在，你必须遵循安装说明；点击下一步。

5. 点击我同意按钮以接受协议条款。

6. 选择 Aptana Studio 要安装的文件夹。

7. 现在，选择一个开始菜单文件夹。

8. 最后但同样重要的是，选择要关联到 Aptana Studio 的文件扩展名。

9. 现在，点击安装按钮以开始安装。

10. 安装过程完成后，只需点击关闭按钮即可完成安装。

发生了什么？

我们刚刚在一台运行 Windows 操作系统的机器上安装了 Aptana Studio。

动手实践 – 在 Mac 上下载和安装 Aptana Studio

1. 为了下载 Aptana Studio 的当前版本，请导航到 Aptana 主页www.aptana.com/products/studio3/download。

2. 简单地在网站上选择你的系统环境，并将 Aptana Studio 包下载到你的工作站上。

3. 双击下载的.dmg文件以提取安装文件。

4. 之后，你只需将 Aptana Studio 拖到你的应用程序文件夹中。

5. 就这样！

发生了什么？

我们在 Mac 操作系统上安装了 Aptana Studio。

首次启动后，Aptana Studio 看起来如下截图所示：

如何为 Java 增加内存

因为 Aptana Studio 是基于 Java 的，确保您允许 Java 分配所需的内存量。在 Aptana Studio 的默认配置中，内存参数已针对常见的大型项目和工 作空间进行调整。Aptana Studio 提供了两个参数来处理这种内存使用：

• -Xms 参数定义了 Aptana Studio 在启动时应分配多少内存

• -Xmx 参数定义了 Aptana Studio 被允许分配的最大内存量（Java 堆内存）

但有时，当你有很多大型项目时，例如，通过增加最大堆内存，你可能可以获得更好的性能。

小贴士

如何显示当前使用的内存？

为了查看当前的内存使用情况，您必须启用堆状态指示器。为此，导航到 窗口 | 首选项 并在左侧树中选择 常规 项。在那里，您将找到右侧的复选框，显示堆状态；选中它，然后单击 应用。现在，内存显示出现在主窗口的右下角。还有一个可用的垃圾箱按钮，可以运行垃圾收集器，该垃圾收集器可以释放不再需要的内存。

实践时间 – 增加 Java 内存

1. 为了增加内存，您必须编辑 AptanaStudio3.ini 文件，该文件位于安装文件夹中。您可以通过使用纯文本编辑器并调整内存参数来完成此操作。

   nano /opt/Aptana\ Studio\ 3/AptanaStudio3.ini
   

   在我们的案例中，因为我们使用的是 Linux 系统，.ini 文件看起来像这样：

   --launcher.XXMaxPermSize
   
   256m
   
   --launcher.defaultAction
   
   openFile
   
   -vmargs
   
   -Xms40m
   
   -Xmx512m
   
   -Declipse.p2.unsignedPolicy=allow
   
   -Declipse.log.size.max=10000
   
   -Declipse.log.backup.max=5
   
   -Djava.awt.headless=true
   

   在这里，您可以调整 Xms 和 Xmx 的值，并将它们更改为所需的兆字节数量。

2. 最后，Aptana Studio 需要重新启动才能使更改生效。

发生了什么？

我们增加了 Java 的内存，以便 Aptana Studio 能够处理大型项目和工作空间。

升级系统

我们强烈建议保持系统更新。Aptana Studio 很可能包含一些需要修复的小错误，以便您可以尽可能有效地工作，而不会出现错误或可能的数据丢失。

小贴士

您是否发现了一个可能的错误？

如果您认为您发现了一个错误，请帮助 Aptana 开发团队尽快修复它，并在 jira.appcelerator.org/browse/APSTUD 上报告。在那里，您还可以了解您发现的错误是否已被开发团队跟踪。您也可以在 Aptana Studio 内部报告错误。我们将在 第十二章 故障排除 中探讨这一点。

在更新后看到总是有新的和有用的功能出现也是很令人高兴的。我个人总是使用更新站点来下载最新的测试版本。如果你更喜欢使用更稳定的版本，最好使用 Aptana Studio 3 发布更新站点。总的来说，有三种更新类型可供选择：

• 稳定版本：这些是最经过测试的。它们与从 Aptana 网站下载的版本相同。

• Beta 版本：这些版本已经经过一定程度的测试，仍在为发布做准备。

• 夜间更新：这些直接来自开发者的服务器。这是可以找到最新功能和修复的 bug 的第一个地方。这些版本可能包含渐进式 bug。使用时请自行承担风险！

  小贴士

  什么是更新站点？

  更新站点是一个简单的 HTTP 链接，其中包含更新 Aptana Studio 以及安装和更新插件所需的所有相关数据。

现在我们第一次运行 Aptana Studio，我们想检查是否有可用的更新。为此，我们只需在主菜单中导航到帮助 | 检查更新。

如果你收到以下消息，可能是因为你的系统用户在没有更改 Aptana Studio 文件权限的情况下打开了 Aptana Studio：

注意

确保启动 Aptana Studio 的用户拥有更新 Aptana Studio 文件的所需权限！我们已经在本章中看到过的以下命令调整了所需的权限：

sudo chown thomas:thomas /opt/Aptana\ Studio\ 3 -R

如果用户拥有所需的权限，Aptana Studio 会检查所有已启用的可用更新站点，与他们联系，并检查是否有可用的更新。

如果在你的任何启用的更新站点上都没有可用的更新，Aptana Studio 会显示消息没有找到更新。

然而，如果有可用的更新，会出现一个窗口，显示你可以安装的所有更新。

只需选择你想要更新的包，然后点击下一步。在确认页面上也点击下一步按钮。最后，确认我接受许可协议条款，通过点击完成来启动更新。

现在，Aptana Studio 连接到所有相关的更新站点，下载当前包并安装它们。完成此过程后，Aptana Studio 会询问你是否想要应用更改或重启 Aptana Studio。在这里，我强烈建议始终选择重启 Aptana。不幸的是，Aptana 重启需要一点时间，但你可以确信所有库都将成功加载。

在这次重启后，你已经完成了你的第一个 Aptana Studio 更新。

小贴士

如何确定已安装的 Aptana Studio 版本？

要确定已安装的 Aptana Studio 版本，只需在主菜单中导航到帮助 | 关于 Aptana Studio 3。如果你还需要知道插件版本和更多信息，只需点击安装详情。

但是，在日常项目工作中，我们通常没有时间去考虑更新。因此，Aptana Studio 为您提供了一个更新提醒。

默认情况下，更新提醒会在每次 Aptana Studio 启动后检查是否有可用的更新。如果有更新，一个类似这样的弹出窗口会出现在主窗口的右下角：

如果您想安装更新，只需在窗口内点击，更新管理器就会出现；它会显示可用的更新。

小贴士

提醒选项

您还可以通过点击更新可用通知中的提醒选项来更改自动更新的处理方式。您将被重定向到带有自动更新区域已选择的偏好设置。在这里，您可以选择 Aptana Studio 应该何时检查更新以及 Aptana Studio 应该如何处理下载和更新。

如何安装第三方插件

如果您想使用 Aptana Studio 与其他编程语言一起使用，这些语言是 Aptana Studio 自然支持的，您必须安装第三方插件。由 Eclipse 提供的插件系统是一项非常复杂的技术，使得安装额外的插件并保持它们更新变得非常容易。作为一个插件安装的例子，我们将从 Tigris 安装 Subversion 插件，我们将在后面的章节中看到。

操作时间 – 安装第三方插件

1. 在我们开始安装 Subversion 插件之前，我们必须检查 Aptana Studio 的更新并安装它们。强烈建议在安装每个插件之前都这样做。

2. 如果您的系统已更新，请打开可用软件窗口，您可以在帮助 | 安装新软件...下找到它。

3. 在这里，您需要添加插件应从中安装的更新站点的 URL。

4. 但是，您从哪里可以获得插件所需的更新站点 URL 呢？

   大多数插件开发者通常会在他们的网站上提供这个更新站点 URL。有时，他们也会提供用于手动安装的附加包。但建议您使用更新管理器安装插件，因为管理器会检查所需的依赖项，如果依赖项不存在，则会阻止安装。

5. 因此，只需快速浏览到 Tigris Subclipse 网站，subclipse.tigris.org，并确定当前可用的所需更新站点的 URL，即subclipse.tigris.org/update_1.6.x。

6. 现在，我们回到 Aptana Studio，并点击添加...按钮以添加我们插件的新位置。

7. 对于名称，只需输入一个标签，例如Subclipse 1.6.x。但不要忘记添加插件的版本号。随着时间的推移，您可能需要为同一插件添加越来越多的更新站点。如果 Subclipse 插件有新的主要版本，也会有新的更新站点位置需要添加。因此，为了避免类似插件的混淆，始终指定一个能够清楚地识别您的更新站点的名称。您甚至可以使用 URL 直接作为标签。

   小贴士

   从存档安装或更新

   通常，您可能找不到您当前需要的插件的更新站点，但您找到了插件的.jar或.zip文件。没问题！只需下载它，然后点击存档...而不是填写位置链接，选择您的本地文件，然后安装即可。

8. 最后，您必须在位置字段中添加 URL，然后点击确定。

   小贴士

   更新站点

   总是确保您有一个当前的更新站点。大多数插件开发者为他们每个主要版本的插件都有几个更新站点。

   现在，您需要稍等片刻，直到表格刷新。之后，您应该看到一个名为Subclipse的条目，您可以展开它。展开Subclipse节点，选择我们需要的包。在下面的截图中，您将看到我们需要为我们的Subclipse插件选择的包：

   

9. 点击下一步按钮，Aptana Studio 将检查所有依赖项是否满足，这应该是满足的。

10. 如前一个截图所示，所有依赖项都已满足。因此，我们可以第二次点击下一步，在安装开始之前，您只需确认条款和条件即可。

11. 当您点击完成时，Aptana Studio 会连接到更新站点，下载所需的包，并安装它们。

12. 当 Aptana Studio 完成插件的安装后，会出现一个对话框，建议您重新启动 Aptana Studio。我们也建议这样做；因此，您应该点击立即重启。

13. 当 Aptana Studio 再次启动时，插件会询问您是否想向 Subclipse 团队发送匿名使用统计信息。

14. 我认为通常支持开发者使用匿名数据是可行的，因为他们也使我们能够免费使用许多优秀的插件和软件。此外，我们通过我们的统计数据帮助他们优化插件，并帮助整合用户的新需求。

15. 因此，我们点击确定。

    如果您以后想改变您的决定，您可以在窗口 | 首选项下进行操作。在那里，您需要导航到团队 | SVN | 使用报告。

刚才发生了什么？

我们刚刚安装了我们的第一个第三方插件。

安装成功后，您将在窗口 | 打开透视图 | 其他…下找到SVN 仓库探索。现在您能够添加一些仓库位置并在这里检出。我们将在第九章协同工作与 SVN 和 Git 中详细说明。

小贴士

保持插件更新

还需要经常检查您安装的插件是否有更新可用。因此，请确保在 Aptana Studio 更新管理器中选择所需的更新站点。

卸载 Aptana

在 Linux 上卸载 Aptana Studio 非常简单。只需从opt文件夹中删除 Aptana Studio 目录：

sudo rm -r /opt/Aptana\ Studio\ 3

删除 Aptana Studio 软件文件夹后，您可以删除现在无用的符号链接：

sudo rm /usr/bin/AptanaStudio3

但不仅如此。在安装过程中，Aptana Studio 创建的数据比你第一眼看到的多。会有用于工作区的文件夹。工作区的默认文件夹位于您的家目录中，~/Aptana Studio 3 Workspace。当您的项目和源代码备份完成后，您可以将其删除。

此外，还有一个在安装过程中创建的 Aptana ruble 文件夹。此文件夹包含您自定义和下载的 ruble。

小贴士

什么是 Aptana ruble？

Ruble 是 Ruby bundle 的简称，是一个允许通过 Ruby 扩展 Aptana Studio 编辑器的运行时环境。Rubles 与 TextMate bundles 兼容，因此您应该能够轻松地将它们转换为 Aptana ruble。

要在 Windows 上卸载 Aptana，只需使用所有程序菜单中的卸载程序。因为这样很简单——就像卸载大多数其他软件一样——我们不想在这里介绍。

Mac OS-X 用户只需将Aptana文件夹从程序文件夹拖到废纸篓中。

注意，在 Mac OS-X 和 Windows 上，还可能有用于 ruble 和工作区的单独文件夹。如果您不再需要它们，也请务必删除。

快速问答 – 测试您的安装知识

Q1. Aptana Studio 3 基于哪个软件框架？

1. 圆形

2. Eclipse

3. 正方形

Q2. 在哪个 Aptana 文件中您可以调整内存参数？

1. AptanaStudio3.ini

2. AptanaStudio3.pdf

3. AptanaStudio3.conf

Q3. 用于调整内存设置的参数名称是什么？

1. Xls和Xml

2. Xtc和Xol

3. Xms和Xmx

摘要

在本章中，我们探讨了安装 Aptana Studio IDE 的要求。之后，我们安装了 Aptana Studio，检查了可用的更新，并安装了这些更新。我们学习了如何增加 IDE 的内存，并在后续章节中安装了 Subversion 插件。最后，我们了解了当不再需要 Aptana Studio 时如何卸载它。

现在，你已经准备好配置你的 Aptana Studio 安装，并了解更多关于视角和视图的信息。

第二章. 基础知识以及如何使用视角和视图

在我们熟悉了安装和更新 Aptana，以及将附加插件集成到 Aptana Studio 中之后，我们将查看 IDE 的主要功能。

在本章中，我们将涵盖：

• 定义一些组件

• 自定义视角

• 创建、保存和删除视角

• 自定义子菜单

• 自定义菜单和工具栏

• 查看一些最常用的视图，例如应用资源管理器、项目资源管理器和大纲视图

• 在文件内搜索和替换

• 自定义 Aptana Studio

总的来说，在阅读本章后，您将了解关于视角的最重要的事情，包括您可以在哪里找到不同的菜单以及最常用的视图。

行动时间 – 更改颜色主题

我一直从不同的 Aptana Studio 用户那里听说，当他们第一次尝试 IDE 时，他们不喜欢默认在 Aptana 的新安装中选择的深色颜色和语法高亮主题。这些人更喜欢传统的语法高亮显示和白色背景等。没问题，让我们通过几个简单的步骤将主题改回经典的 Eclipse 主题。

1. 导航到窗口 | 首选项，然后在Aptana Studio条目下选择主题树项。

2. 在选择框内选择您喜欢的主题。

3. 在您选择了一个您觉得令人愉快的主题后，您将能够调整一些颜色并更改编辑器的字体。请慢慢来，尝试一下不同的设置可能性。

发生了什么？

我们已经更改了主题，因此 Aptana 现在具有所需的外观。

小贴士

保存您的主题

在开始个性化您的主题之前，请按主题名称右侧的+按钮以创建其副本。最后，当您完成自定义后，最好通过导出保存您的主题。现在您将能够与团队成员共享它或在重新安装 Aptana 后恢复它。

行动时间 – 配置 Tab 行为

Tab键是开发者最常用的键之一，每个开发者的首选配置都大不相同。在以下步骤中，您将看到如何在 Aptana Studio 中调整 Tab 首选项：

1. 导航到窗口 | 首选项，然后在通用条目下选择文本编辑器树项。

2. 在显示制表符宽度字段中，您可以更改用于Tab键宽度的空格数。

3. 此外，您还可以勾选为 Tab 插入空格复选框，这样Tab键现在将插入您首选的空格数而不是单个Tab字符。

发生了什么？

我们已经更改了 Tab 的行为，因此 Aptana Studio 现在会按照您的喜好处理Tab键的按下。

定义

首先，我们将定义一些术语，以便你熟悉我们正在讨论的组件。这些术语与以下截图相关。

• 导航：当我们谈论导航栏时，我们指的是 Aptana Studio 窗口顶部的菜单栏。

• 工具栏：工具栏是位于导航栏下方直接下的按钮行，它提供了一些最常用的操作按钮。

• 视角菜单：视角菜单位于工具栏的右侧，允许你在不同的视角之间切换。

• 视角：视角指的是一组视图、编辑器和首选项，它们针对特定类型的开发活动进行了优化。

• 编辑器：编辑器是一个你可以编辑和保存文件的空间。

• 视图：视图是在视角内可以进行操作的区域。Aptana Studio 提供了许多不同的视图，可以收集来自定义视角。

• 状态栏：状态栏位于 Aptana Studio 窗口的底部，主要提供信息。

导航

导航栏是一个菜单元素，正如你在许多其他软件程序中所知。我们只想指出的是，导航栏中的项目会随着视角的切换而改变。如何影响哪个菜单项出现在哪个视角中，我们将在自定义视角配方中讨论。

导航栏还依赖于当前焦点。例如，如果编辑器视图拥有焦点，导航栏将通过一个名为源的菜单元素进行扩展。

工具栏

正如刚才提到的，工具栏提供了一些选定的操作按钮。所有相关的按钮都被视为一个组，可以通过拖放轻松移动，并且可以通过自定义 视角...选项控制每个按钮的可见性。

这种功能使你能够为每个视角创建一个完整的依赖工具栏，其中只集成了所需的按钮。

此工具栏的附加功能是你可以将你的按钮组放置在多行中。如果你的系统显示不是很大，以至于所有所需的按钮都只能安排在一行中，这将非常有用。

提示

你知道吗？

这种按钮分组且可以添加和移动各种项目的工具栏被称为Coolbar。

在以下表格中，你可以找到可用工具栏按钮的结构和功能的小部分摘录。完整的列表可以通过在窗口 | 自定义视角...选项卡上的工具栏结构中找到。如果你在你的当前视角中找不到所需的工具栏按钮，也应该查看这个部分。我们将在本章后面的自定义视角配方中讨论如何自定义视角以及工具栏。

因此，在 图标 列中，您可以看到我们正在讨论的工具栏按钮。组 列显示了按钮所属的组。最后，描述 列提供了关于按钮能做什么的简要说明。

图标	组	描述
	文件	新建 工具栏按钮允许您创建项目、文件夹、文件等。
	文件	保存 工具栏按钮保存当前打开的文件。
	文件	保存所有 工具栏按钮保存所有打开的文件。
	文件	打印 工具栏按钮允许您打印当前打开的文件。
	Aptana	切换显示或隐藏大纲视图 工具栏按钮显示或隐藏 大纲 视图。
	Aptana	切换显示或隐藏应用资源管理器视图 工具栏按钮显示或隐藏 应用资源管理器 视图。
	Aptana	Aptana Studio 启动页面 工具栏按钮打开 Aptana Studio 启动页面，显示来自 Aptana 的最新新闻。
	Aptana	显示预览编辑器 工具栏按钮打开当前打开文件的预览。
	Aptana	打开终端 工具栏按钮打开一个新的 终端 视图。
	Aptana	主题 工具栏按钮在小的三角形上提供了一个菜单，用于切换到当前使用的主题，或者通过点击颜色按钮打开主题偏好设置窗口。
	启动	打开 URL... 工具栏按钮允许您通过输入 URL 打开文件。
	启动	在所选行设置或清除断点 工具栏按钮在当前所选行设置或清除断点。
	启动	调试 工具栏按钮允许您调试当前应用程序。
	启动	运行 工具栏按钮允许您运行当前应用程序。
	启动	外部工具 工具栏按钮允许您运行外部工具。
	搜索	搜索 工具栏按钮打开搜索窗口。小三角形允许您直接导航到搜索窗口内的特殊搜索标签页。
	编辑器展示	标记出现 工具栏按钮标记当前使用文件中所有类似的选择。
	编辑器展示	切换块选择模式 工具栏按钮启用或禁用块选择模式，允许您选择字符块。
	编辑器展示	显示空白字符工具栏按钮允许你显示字符，例如空白或制表符。
	导航	下一注释工具栏按钮将跳转到下一个配置的注释。
	导航	上一个注释工具栏按钮将跳转回上一个配置的注释。
	导航	最后编辑位置工具栏按钮将跳转回你最后编辑的文件。
	导航	后退工具栏按钮将跳转回最后一个有焦点的文件。
	导航	前进工具栏按钮将跳转回有焦点的文件。

视角

视角是一组视图、编辑器和首选项，它们针对特定的活动或开发过程进行了优化。视角可以很容易地适应你的需求。

但为什么需要定义不同的视角？

由于不同编程语言的发展，你需要不同的视图和编辑器。也可以为特定项目定义一个视图，例如，经常使用终端进行 shell 操作的项目应默认包含在终端视图中。

小贴士

使用视角在不同显示器上工作

如果你使用笔记本，但同时也经常使用额外的显示器，那么你可能在不同的显示分辨率之间工作。因此，为每个显示分辨率定义一个视角是有可能的用例。

你如何使用视角菜单来更改视角，我们将在下一节中介绍。但如果你转到窗口 | 导航，还有更多可能性。除了打开、关闭和更改功能外，还有重置、保存和自定义视角的选项。

如果你通过拖放、打开或关闭新视图，或者只是调整了视图区域的大小，视角将不再像你之前定义的那样。因此，你可以将视角重置为你之前保存的那个。所有位置、视图等都将恢复。

例如，如果你向你的视角添加了一个新视图并保存了它，Aptana Studio 将在每次打开此视角时显示新视图。此外，你还可以保存一个视角的副本，并使用新名称，这样就可以创建非常相似但仍有区别的视角。

最后，有一个选项可以自定义你的视角。这是一个非常强大的功能，我们将在稍后详细讨论。

小贴士

视角中的可用快捷键

如果你不确定在视角内可以使用哪个快捷键，只需按Ctrl + Shift + L，即可查看当前可用的所有键绑定列表。

视角菜单

视图菜单允许您打开、关闭和切换不同的视图。

第一个左侧按钮打开一个新的视图。为了打开一个新的视图，您可以点击它，并弹出一个包含几个视图和最终名为其他...的条目的菜单。现在您可以直接打开列出的视图，或者通过使用其他...按钮打开使用频率较低的视图。

小贴士

自定义视图菜单

众多自定义可能性之一是选择应显示在此菜单中的视图条目。您如何选择您最常用的视图并让它们出现在此菜单中，您将在本章稍后学习，当我们开始创建自己的视图时。

只需选择一个条目并点击确定，Aptana Studio 将显示该视图定义的所有视图、编辑器和首选项。

在打开视图按钮的右侧将列出所有打开的视图。您可以通过简单地点击此视图按钮来切换到打开的视图。

小贴士

切换视图快捷键

为了快速在视图之间切换，您可以使用快捷键 Ctrl + F8 来向前切换视图，以及 Ctrl + Shift + F8 来向后切换视图。

如果没有足够的显示空间并列出所有打开的视图，它将显示为一个带有两个箭头的按钮，位于其右侧。此按钮将提供一个下拉菜单，让您从所有打开的视图中选择当前使用的视图。但您也可以通过右键单击来自定义菜单，通过点击显示文本条目来禁用文本标签，以节省更多空间并防止下拉菜单占用空间。

小贴士

更多视图功能

视图菜单仅代表一个快速菜单。为了打开或关闭一个视图，您也可以导航到窗口 | 打开视图或窗口 | 关闭视图。

注意

如果您在性能较低的环境中使用 Aptana，最好同时打开较少的视图。关闭当前未使用的视图。

编辑器

Aptana Studio 提供了许多针对其编程语言专门化的不同编辑器。例如，XML 和 HTML 编辑器提供了适应的语法高亮和展开或折叠当前打开文件节点的选项。

一些受支持的最好编辑器如下：

• JavaScript 开发

• Ruby 开发

• Rails 开发

• PHP 开发

• HTML 开发

• CSS 开发

小贴士

转到行

使用快捷键 Ctrl + L，您能够打开转到行对话框。只需打开对话框，输入行号，然后按Enter键，编辑器光标就会跳转到输入的行号。

提供的编辑器及其支持的完整列表可以在 Aptana Studio 网站上找到，网址为 wiki.appcelerator.org/display/tis/Editor+Feature+Matrix。

视图

视图是包含来自 Aptana Studio 或来自 Aptana Studio 集成插件的某些分组功能的小容器。每个视图的基本功能都是相同的。可以通过导航到 窗口 | 显示视图 来打开一个视图。让我们详细看看大纲视图，这是一个非常简单的视图。

每个视图都是一个容器，左侧有一个标签，其中包含视图菜单的图标，然后是标签（在我们的例子中是大纲），最后是一个关闭按钮，它可以从视图中移除。但视图标签还有额外的功能。您可以将其拖放到视图中另一个区域（顶部、右侧、底部或左侧）。如果您双击它，视图将被最大化到 Aptana Studio 窗口的整个大小。如果同一区域有多个视图，视图标签将连在一起。

在视图的右上角，您会发现一些额外的功能。在最右边有一个额外的最大化按钮，它具有与在标签上双击相同的功能。从右数第二个按钮可以最小化一个视图，这样您就有更多空间用于其他视图，如编辑器。其他按钮因视图而异。这些按钮控制每个视图的外观和功能。

小贴士

帮助提示

如果您不知道哪个按钮有什么功能，只需将鼠标悬停在按钮上，就会显示一个带有其功能描述的小提示。

在使用 Aptana Studio 的时候，任何时候只能有一个视图处于活动状态。这意味着活动视图是拥有焦点以接收键盘操作等的视图。

在本章的最后，我们将向您展示一些最常用的视图及其最有用的功能。

小贴士

视图间切换的快捷键

如果您想在不同视图之间切换或打开一个新视图，只需按下 Alt + Shift + Q 以显示所有可用的视图快捷键列表。在这个列表中，您可以使用上键和下键选择所需的视图，或者直接按下快捷键的最后一个键。

状态栏

最后，是状态栏，它主要提供信息。在这里，有不同视图放置的消息和一些功能，如堆状态，它显示了我们在第一章中激活的内存使用情况。但还有一个非常实用的功能，称为快速视图栏。它看起来如下截图所示：

小贴士

快速视图栏在哪里？

如果您在状态栏中没有找到这个栏，它可能已被禁用。只需导航到窗口 | 首选项，然后在通用条目下选择视角树项，并在快速视图部分取消选择隐藏空快速视图栏复选框。

快速视图栏是一个小的视图选择按钮，后面跟着一个图标列表，包含所有用于快速视图操作所选视图。这对于我们有时只需要执行快速操作的观点非常有用。如果快速视图已打开，并且您在视图外部点击某处，快速视图会自动隐藏。

还包括文件相关的功能，如命令菜单和文件信息，这些仅在编辑器视图获得焦点时可见。它显示有关文件是否可写以及光标当前所在的列和行的信息。

自定义视角

Aptana Studio 允许您以非常高的细节自定义您使用的视角。您有多种设置和编译选项，可以将所有需要的功能和动作收集到 IDE 的理想位置。

您可以通过导航到窗口 | 自定义视角...来找到允许您进行大部分设置以自定义视角的窗口。自定义视角...窗口分为四个标签页，我们可以在这里自定义工具栏、导航、命令组和快捷键。

第一个标签页用于工具栏可见性选项。在这里，您可以选择每个按钮组应可见的按钮。

第二个标签页用于菜单可见性选项。在这里，您也可以在您视角的导航中选择所需的功能。

第三个标签页用于命令组可用性选项。在此标签页中，您可以将命令组添加到您的视角中。例如，如果您想将一些操作，如 SVN 插件的提交或更新，添加到工具栏或导航中，您必须在此标签页的可用命令组选项中选择 SVN 条目。现在您可以在工具栏和菜单标签中选中 SVN 功能。

第四个也是最后一个标签页用于快捷键选项。此标签页提供了通过导航到文件 | 新建、打开视角和显示视图菜单来修改子菜单的能力。

创建自定义视角

现在我们想创建我们自己的自定义视角。因此，我们将首先创建一个与我们的目标自定义视角最相似的视角的副本。这很快就能完成。例如，只需激活Web 视角，导航到窗口 | 另存为视角...，并以不同的名称保存视角。因此，我们使用相同的名称，并在其后加上单词customized。

在我们按下确定按钮后，Aptana 将创建当前激活视角的完整副本，我们现在可以开始对其进行自定义。

安排视角视图

从新工作区的Web 视角选项开始，我们首先将安排所需的视图。因此，我们通过单击此标签激活示例视图。视图获得焦点，关闭按钮将可见。现在，通过单击标签右侧的关闭按钮，将示例视图从你的视角中隐藏。

此外，以同样的方式关闭所有其他你不需要的视图。

因此，现在，在我们刚刚移除了所有不必要的视图之后，我们有足够的空间放置真正必要的视图，并且我们可以重新排列这些剩余的视图，使其结构更有用。

安排视图的时间

将视图移动到视角的另一个区域可以通过不同的方式完成。最简单、最快的方式是通过拖放操作。

1. 将鼠标移至视图的标签上，通过按下并保持鼠标左键开始拖动操作。

2. 当你在 Aptana Studio 窗口的不同区域拖动视图时，请注意鼠标光标。当你将视图放置在当前位置时，光标将变为箭头，表示视图将附加在该区域。

3. 释放鼠标左键，以便将视图放置在当前位置。

移动视图的另一个选项是使用上下文菜单。

1. 在标签上右键单击，出现上下文菜单。

2. 前往移动 | 视图，仅将标签移动到新区域。

3. 如果你想一次性移动整个标签组，请转到移动 | 标签组。

4. 选择操作视图或标签组视图后，光标将变为帮助你放置视图的图标。

5. 如果光标显示的图标表明视图将在目标区域附加，只需单击鼠标即可完成移动操作。

发生了什么？

现在我们已经将所有视图放置在我们需要的区域。

最后，如果我们遗漏了一些额外的视图，我们可以通过添加更多视图来补充我们的视角。

添加新视图的时间

要将新视图添加到我们的视角中非常简单；只需按照以下步骤操作：

1. 导航到窗口 | 显示视图。

2. 如果所需的视图不在菜单中，只需单击其他...，你将获得一个包含所有可用视图的选择窗口，按模块或插件分组。

3. 只需选择所需的视图，然后通过点击确定来接受它。

4. 选择窗口会自动关闭，新视图会出现在视角的随机区域。

5. 现在，您只需将视图移动到视角所需的区域。

发生了什么事？

在您完成所需视图的重新排列后，您的视角可能看起来像以下截图：

定制选择菜单

现在，在我们收集了视角所需的视图之后，我们将考虑那些我们只偶尔使用的视图。因此，我们可以以快速的方式访问这些视图。我们可以自定义快速视图菜单的选择，正如您所记得的，它位于状态栏的左侧，以及位于窗口导航条下的显示视图菜单中的选择。

操作时间 - 定制视图选择菜单

在第一步，我们想要定制视图选择菜单。

1. 导航到窗口 | 自定义视角...并选择快捷方式选项卡。

2. 在此选项卡的左上角，您将找到一个复选框，允许您选择要定制的子菜单。我们选择显示视图条目，并查看选项卡的其他内容。

3. 在左侧，我们看到快捷方式类别。如果您在左侧选择一个类别，内容区域将显示该类别中所有可用的视图条目。

4. 现在您必须遍历类别并选择或取消选择所需的视图。在这个时候，我们想要取消选择大纲和应用探索器视图，因为如您所记得，Aptana Studio 提供了这两个视图及其自己的工具栏按钮。因此，激活通用类别并禁用大纲条目。进一步，激活工作室类别并禁用应用探索器条目。

5. 如果您准备好了，通过点击确定来接受更改，并查看结果。

发生了什么事？

现在我们已经用所有必要的视图项填充了快速视图和显示视图菜单。

以同样的方式，我们也可以自定义视角菜单。

1. 再次导航到快捷方式选项卡，并选择打开视角子菜单。

2. 这里没有可用的类别，所以我们只选择最常用的视角，例如，SVN 仓库探索、Web和Web 定制。结果可能看起来像以下截图：

在这些步骤之后，我们已经将所有常用的视角项填充到视角菜单中。

操作时间 - 定制新子菜单

我们可以定制的最后一个子菜单是在导航到文件 | 新建或点击新建工具栏按钮右侧的小三角形时找到的新子菜单。

1. 再次导航到快捷键选项卡并选择新建子菜单。

2. 例如，如果我没有在 Ruby 和 Rails 项目中工作，我将取消选择Other类别中的Rails Project条目和Ruby类别中的Ruby Project条目。

3. 代替被删除的两个条目，我在Web类别中选择了PHP 项目条目。

发生了什么？

我们现在创建了一个最常用项目类型的快捷方式，以便快速访问。

命令组可用性

在自定义视角窗口的第三个选项卡命令组可用性选项卡中，您可以选择要添加到您视角中的命令组。

命令组提供菜单项、工具栏按钮和键盘绑定的命令。在一个视角中使命令组不可用会移除这些执行命令的方法。在您使命令组可用后，您能够详细调整哪些功能应该可用以及它们在什么上下文中可用。

操作时间 – 添加和删除命令组可用性

我们现在将添加 SVN 插件到命令组，因为我们想在后面的章节中使用它。

1. 导航到窗口 | 自定义视角...并选择命令组可用性选项卡。

2. 在可用命令组列的左侧选择SVN条目，菜单栏详情和工具栏详情列将填充相关的命令。

3. 其他不必要的条目，如可能不需要的Ruby Debug条目，可以取消选择。

4. 在您通过点击确定接受更改后，窗口会自动关闭，并且您的视角工具栏和菜单正在刷新。

发生了什么？

最后，如果您仔细查看工具栏和菜单，您会看到已经添加了新的 SVN 条目。我们现在将看到如何自定义它们。

工具栏可见性

现在我们想要自定义工具栏的可见性。这意味着我们可以选择工具栏提供的可用功能。

操作时间 – 自定义工具栏

1. 再次导航到窗口 | 自定义视角...并切换到工具栏可见性选项卡。

   小贴士

   禁用条目

   工具栏可见性和菜单可见性选项卡中的灰色条目已被禁用，因为它们的命令组不可用。只需切换到命令组可用性选项卡并激活所需的组。

2. 在这里，您可以找到所有可用的工具栏按钮，以及通过使用复选框来启用和禁用它们的选项。作为默认设置，大多数工具栏按钮已经被选中。但是，因为我们想减小工具栏的大小，所以我们取消选中了从 SVN 检出选项的工具栏按钮。因此，我们搜索SVN选项卡并删除了完整的条目，因为其中只包含从 SVN 检出。

发生了什么？

经过这些步骤，您将有一个精心挑选的工具栏按钮。

菜单可见性

现在我们将定制菜单可见性。这意味着我们可以选择导航栏提供的可用功能。

行动时间 - 定制菜单

1. 再次导航到窗口 | 自定义视角...并切换到菜单可见性选项卡。

2. 在这里，您可以找到所有可用的菜单条目，以及通过使用复选框来启用和禁用它们的选项。就像工具栏可见性选项一样，菜单可见性也有一个默认设置，即所有附近的条目都已经选中。但是在菜单的情况下，这是可以的——我们可以保持不变。

3. 如果您已经取消选中了一些条目，您可以导航到相关的菜单点，您会看到这些条目已经消失了。

保存视角

在您花费一些时间通过创建一些视角来定制 Aptana Studio 之后，有一个重要的事情需要添加。

不要忘记在所有更改完成后保存视角。如果您忘记了，Aptana Studio 将在关闭 IDE 后丢失所有这些更改！

行动时间 – 保存视角

为了保存您的视角，只需按照以下步骤操作：

1. 导航到窗口 | 另存为视角...并选择要保存的视角。

2. 如果您想保存现有的视角，通过点击是来确认保存操作。

   现在，您个性化视角的所有更改都已保存。如果您现在移动一些视图或更改其他内容，在执行重置后，您的视角将看起来并表现得像保存的那个。

视角首选项

但还有更多。如果您导航到窗口 | 首选项，然后在树中转到常规 | 视角，您可以配置更多视角的行为。

例如，您可以决定新视角是在同一个窗口中打开还是在新的窗口中打开，等等。我们将保持这个设置不变，并查看这个窗口中的其他可能性。

删除视角

在本节中，我们将了解如何删除一个视角。

行动时间 – 删除视角

如果您想删除一些未使用的视角，只需按照以下步骤操作：

1. 再次导航到窗口 | 首选项，然后在树中转到常规 | 视角。

2. 在这里，你可以找到所有可用视角的完整列表。现在你可以选择一个不再需要的视角，并通过点击删除按钮将其删除。

我们已经删除了一个未使用的视角；并且它已经完全从 Aptana Studio 中移除，不再出现在任何地方。

标记默认视角

在我们创建了自己想要经常使用的视角之后，我们应该将这个视角标记为默认视角。

操作时间 – 标记默认视角

1. 再次导航到窗口 | 首选项，然后在树中转到通用 | 视角。

2. 在这里，你可以找到所有可用视角的完整列表。现在你可以选择一个派生视角，并通过点击设置为默认按钮将其标记为默认视角。

发生了什么？

我们已经将我们自己创建的视角标记为 Aptana Studio 的默认视角。

最常用的视图

在下一节中，我们将查看 Aptana Studio 中最常用的几个视图。

应用资源管理器视图

应用资源管理器视图通过处理项目中的文件来帮助你。在这个视图的头部，你可以选择要工作的项目，然后是一个与系统搜索链接的文件搜索。所以如果你使用这个搜索字段进行搜索，搜索视图将显示结果。

在视图菜单中，你可以通过点击小三角形按钮打开它，Aptana Studio 为你提供了与编辑器链接的功能。这是一个很好的功能，它总是选择与你在编辑器中选择相同的应用资源管理器视图中的文件。

但是，你可以通过点击自定义视图...标签来在这个视图中进行更多自定义。视图菜单的自定义对话框由两个标签组成。首先是过滤器标签。过滤器标签允许你，正如其名称所暗示的，过滤视图菜单中列出的文件。

因为我们经常处理隐藏文件，例如.htaccess文件，所以我们禁用了.*资源条目，这隐藏了所有以.开头的资源。

此外，还有一个内容标签，它允许你显示扩展的内容。

但是，就像在大多数其他视图中一样，在这个视图中也有特定的视图按钮可用。从左边开始，有一个可用的按钮可以折叠所有打开的元素。接下来是一个部署按钮，我们将在后面的章节中讨论。最后，命令菜单提供了其他一些功能；但我们还没有讨论这一点。

项目资源管理器视图

项目资源管理器视图与应用资源管理器视图类似。区别在于项目资源管理器视图跨越所有项目，因此我们只讨论额外的功能。

自定义视图对话框在内容选项卡中提供了一些更多可用的扩展。

其他差异在于视图特定的按钮。在这里，与编辑器链接的功能有自己的按钮。此外，还有同步、上传和下载按钮，这些对于远程工作至关重要。

属性视图

属性视图根据当前打开的文件和编辑器中光标的位置显示信息。如果你选择了某些字符，它也会受到影响。以下信息包括选定的文本、长度、偏移量等：

但属性视图也会显示如果你在文件树中选择一个文件时的一些信息，例如关于应用资源管理器视图或项目资源管理器视图的信息。在这种情况下，信息包括名称、位置和最后修改时间。

大纲视图

大纲视图显示当前打开和聚焦文件中代码元素的分层分组。包含的元素取决于相关文件的文件类型。因此，如果相关文件是一个标记文件，如 HTML 或 XML 文件，大纲视图将显示其节点的结构。

在这种情况下，大纲视图允许你展开和折叠文件的节点。还有一个过滤功能，允许你搜索节点，如果你通过双击大纲视图选择一个节点，编辑器将跳转到相关行。

HTML 文件的大纲视图除了提供显示结构内文本节点按钮外，还提供了一些其他功能。

如果你打开一个脚本文件，例如 JavaScript 或 PHP 文件，大纲视图将显示包含的变量、函数、类等。大纲视图可以显示的信息量太大，难以一一列举。

但每个文件类型都有一些功能。A-Z按钮按字母顺序对所有级别的元素进行排序。在视图菜单中，你可以通过点击小三角形按钮打开它，你还可以展开或折叠所有元素。

因此，大纲视图是快速导航大型文件中最有帮助的视图之一。

搜索和替换

Aptana Studio 中的搜索工具是一个强大的工具，它由一个搜索对话框组成，你可以在这里配置并启动搜索，以及一个搜索视图，其中列出了搜索结果。此外，还有一个替换匹配项的功能和一个搜索首选项部分。

搜索对话框

搜索对话框可以通过使用搜索菜单项或点击搜索工具栏按钮来打开。但根据当前活动视图，有时也可以通过快捷键Ctrl + F访问。

对话框本质上包含三个部分。首先，是搜索模式，换句话说，要搜索的字符。在这里，您可以选择区分大小写或不区分大小写的搜索。但搜索模式也可以是正则表达式，这使得搜索更强大。

此外，您可以定义一个文件名模式，以决定 Aptana Studio 应在哪些文件中搜索。这非常有用，例如，如果您已经知道相关的搜索模式可以存在于一个 PHP 文件中，您可以使用*.php作为文件名模式。

最后是范围，它可以限制检查的文件数量。此值的默认设置是工作区范围。这意味着，如果您以工作区范围开始搜索，Aptana Studio 将在工作区中的所有文件和所有项目中查找模式。在某些情况下，这可能是非常多的文件。因此，最好从一开始就限制范围，例如，通过选择一个资源。这很快就能完成。在您打开搜索对话框之前，导航到您的应用资源管理器或项目资源管理器视图，并选择您想要搜索的文件夹。现在打开搜索对话框，并在范围部分选择选定的 资源条目，然后您就可以在有限范围内进行搜索了。

搜索视图

搜索视图与搜索对话框紧密相关，我们刚刚已经描述过。在您开始搜索并启动它之后，搜索视图将可见，并列出所有匹配的文件。

在我们示例搜索第一个模式在工作区范围内之后，我们得到了以下搜索结果：

如果视图菜单设置显示为树状被选中，列表结构将像文件树一样构建，并相应地展开和折叠。在每个文件条目之后是匹配项的数量。如果您展开一个文件节点，您将得到一个列表，其中列出了找到匹配项的行。因此，当您双击搜索结果行时，编辑器将在相关行打开文件。

搜索视图提供了一系列不同的视图特定按钮，这些按钮通过有用的功能扩展了搜索。

从左侧开始，有显示下一个匹配项按钮和显示上一个匹配项按钮，如果您正在搜索搜索结果的特殊匹配项，这两个按钮非常有用。

小贴士

快速访问下一个和上一个匹配项

使用快捷键Crtl + .快速切换到下一个匹配项，或使用Crtl + ,切换到上一个匹配项。

删除所选匹配项（删除）按钮和删除所有匹配项按钮允许你从列表中删除匹配项。删除所选匹配项（删除）按钮仅删除单个匹配项，而删除所有匹配项按钮则删除所有匹配项。

展开全部按钮和折叠全部按钮仅在将搜索结果显示为树时可见，并允许你展开或折叠所有条目。

再次运行当前搜索（F5）按钮允许你再次启动相同的搜索。如果你已经更改了匹配项，以便这些匹配项可以通过新的搜索被省略，这很有用。

取消当前搜索按钮在你在大量文件中运行搜索且搜索似乎花费了很长时间的情况下取消搜索。

我们将要看到的最后一个按钮是显示上一个搜索，它通过一个小三角形扩展，提供包含最近搜索的列表。

搜索首选项

就像 Aptana Studio 的许多其他主要功能一样，搜索视图在首选项标签页中有一个部分。为了进行一些更改，导航到窗口 | 首选项，然后在树中选择通用 | 搜索节点。

在这里，你将找到其他选项，例如重用编辑器以显示匹配项。此选项控制 Aptana Studio 是否为每个选定的文件打开自己的编辑器，或者始终重用相同的编辑器。

当你激活此选项时，有时它可能很有用，例如，当你使用显示下一个匹配项或显示上一个匹配项功能在搜索结果中进行导航时。这样，你就不需要为每个打开的文件分配一个专门的编辑器，每次也必须关闭它。

但另一方面，如果你为每次搜索打开一个文件，查看该文件，并想要查看另一个文件，那么如果 Aptana Studio 使用一个新的编辑器而不是相同的编辑器，你可以在其中进一步查看或工作，那就更好了。

替换匹配项

如果你想在项目中替换一些字符模式，你也可以使用搜索功能来完成此操作。

按照刚才描述的模式进行搜索，不同之处在于你按下替换...按钮而不是搜索对话框中的搜索按钮。我们的搜索示例firstDataNode模式开始，并在另一个对话框中显示替换。

在对话框的标题栏中，你可以获得有关在多少个文件中找到多少个匹配项的信息。在替换字段中，你会恢复你的搜索模式，后面是必须输入替换内容的字段，如果搜索模式也是一个正则表达式，则该替换内容也可以是正则表达式。

最后，在大量文件中替换某些内容之前，你可以先查看预览。当你不知道你的模式是否可能包含不想要的匹配项时，这很有用。

如果你不需要预览，只需点击确定来替换所有出现。

自定义 Aptana Studio 3

在以下步骤中，我们希望自定义我们的 Aptana Studio 安装，以便你能在舒适的环境中工作。

尝试一下英雄配置 – 配置 Aptana Studio

你的第一个任务是进入你的 Aptana Studio 安装，并尝试创建你自己的视角。继续按照你的喜好进行个性化设置，并按照你的需求安排包含的视图。

最后，别忘了保存你的更改；否则，在你重启 Aptana Studio 后，所有更改都将丢失。

快速测验 – 测试你新学到的 Workspace 知识

Q1. 按钮分组并可以添加和移动各种项目的工具栏叫什么？

1. 工具栏

2. Foolbar

3. Coolbar

Q2. 你可以在哪个菜单中切换视角？

1. 主菜单

2. 视角菜单

3. 右键菜单

Q3. 你如何获取未知按钮的描述？

1. 你将鼠标悬停在按钮上，等待工具提示

2. 你只需按下它，看看会发生什么

3. 你右键点击它，并获取一些关于它的信息

Q4. 哪些元素可以在视角中分组？

1. 视图、导航和工具栏

2. 视图、编辑器和首选项

3. 编辑器、窗口和状态栏

Q5. 为什么你不能选择工具栏和菜单可见性选项卡中的灰色条目？

1. 因为所需的命令组不可用

2. 因为该功能未安装

3. 因为你没有所需的授权

Q6. 为什么你应该在做出一些更改后保存你的视角？

1. 因为这些更改会立即丢失

2. 因为操作系统重启后更改会丢失

3. 因为 Aptana Studio 重启后更改会丢失

Q7. 哪个功能让你可以在视图中快速执行操作？

1. 快速视图菜单

2. 快速食品菜单

3. 快速树菜单

Q8. 你如何加快搜索速度？

1. 通过使用更小的范围

2. 通过减少搜索模式长度

3. 通过使用更简单的搜索模式

摘要

在阅读本章后，你应该能够使用所有需要的功能来自定义 Aptana 和你的视角。此外，你应该能够创建一个包含所有所需功能的自定义视角。

你应该知道如何使用视图，以及如何在你的工作空间或更小的范围内搜索和替换某些字符模式。

在下一章中，你将开始创建你的第一个工作空间和项目，并学习如何使用它们。

第三章. 使用工作区和项目

现在我们已经熟悉了 Aptana Studio 的基本结构和主要功能，让我们继续探讨两个最重要的功能，即工作区和项目。

工作区和项目允许您将所有项目和作业文件分割和分组成逻辑上和用户友好的单元，通常使工作更加高效。让我们直接开始，看看工作区是什么以及它们有什么好处。

本章我们将涵盖的主题包括：

• 工作区是什么以及它们有什么好处

• 创建和删除工作区

• 如何在不同的工作区之间切换

• 导入和导出 Aptana Studio 首选项

• 在 Aptana Studio 中可用的项目类型

• 创建单个项目

• 常见的导入项目方式

• 删除不必要的项目

• 更改项目类型

• 关闭和打开项目的原因

• 在处理大型项目时提高性能

• 在项目中创建新文件

工作区

工作区允许您将许多可能相互关联的项目和源代码分组在一起。工作区还包含一系列首选项，例如配置的主题、快捷键设置和代码格式配置。请注意您工作区的大小；它不应该太大，否则系统的性能可能会受到影响。Aptana Studio 可以处理的项目数量和大小取决于您的系统内存和 Aptana Studio 配置的内存设置。

小贴士

更高的性能

如果您注意到随着您项目的增长，系统的性能在下降，您可能需要将工作区分成多个独立的工作区或关闭一些当前未使用的项目。关闭项目的具体方法将在本章后面解释。

对于开发者来说，操作工作区的方式有很多种。有些人使用单一的工作区来管理所有项目。在这种情况下，他们通常必须关闭不需要的项目或增加内存以保持良好的性能。

其他开发者反过来，会使用很多不同的工作区，并进一步将其作为分组的机会。

但为什么你应该将项目分组到不同的工作区中呢？

有很多原因。比如说，你用不同的编程语言编码。例如，你为一位或多位客户间歇性地在不同的项目上工作。客户组 1 正在基于 Zend 框架/PHP 的项目上进行开发，而客户组 2 正在基于 OpenLaszlo/Flash 的项目上进行开发。在这里，我们将所有属于 ZendFramework/PHP 类别的项目放在一个工作区中，而将所有其他项目放在 OpenLaszlo/Flash 类别的另一个工作区中。如果你需要知道如何在类似的项目中解决特定问题，你可以快速找到答案。由于我现在以自由职业者的身份工作，我自己使用根据个别客户分组的不同工作区。这意味着我经常不得不改变我的工作环境。对于一些客户，我在现场帮助他们，而对于其他客户，我在自己的办公室工作。

我们与许多客户合作完成了不同的项目，但这些项目的方法完全不同。在这里，为每个客户创建一个单独的工作区非常有用。如果你为不同的客户开始一个新的工作部分，你可以简单地更改工作区，一切都将保持你离开时的状态。

当前工作区

如果你经常在不同的工作区中工作，你可能想知道：我现在在哪个工作区？或者当前工作区在我的本地文件系统中的位置在哪里？我如何定位当前工作区？

1. 导航到文件 | 切换工作区... | 其他...。

2. 在这里，您可以在工作区字段中找到当前活动工作区的路径。

3. 按取消关闭此窗口。

创建工作区

现在我们想开始使用项目。首先，我们必须定义一个工作区。

行动时间 - 创建新的工作区

1. 导航到文件 | 切换工作区 | 其他...。

2. 窗口要求我们选择一个文件夹，以便我们存储新的工作区。因此，由于我支持使用多个小型工作区而不是一个大型工作区，我在我的主目录中首先创建了一个名为workspaces的文件夹。

3. 第一个工作区应该包含我的个人项目，因此我给它们命名为tdeuling并附加创建日期。

4. 在复制设置选项卡中，您可以选择哪些设置应该复制到新工作区。工作区布局将复制所有打开的视图、它们的尺寸和选定的视角到新工作区。工作集将复制所有用户定义的工作集到新工作区。

5. 通过点击确定，Aptana Studio 会自动保存打开的工作区并关闭它。此后，Aptana Studio 会自动启动到新创建的工作区。

发生了什么？

我们刚刚创建了一个额外的工作区，你可以在这里定位一些项目，可能是针对某种特殊的编程语言，或者用于分组客户项目。

导入和导出首选项

仔细观察后，我们发现所有设置都丢失了。这可能会相当令人烦恼，尤其是如果您已经做了很多个性化设置并需要创建一个新的工作空间。为了避免每次创建新工作空间时都需要设置偏好，Aptana Studio 提供了导入和导出设置的选项。

操作时间 – 导出 Aptana Studio 偏好设置

1. 导航到文件 | 导出...。

2. 在窗口中，选择通用条目下的偏好设置条目，然后点击下一步。

3. 选择要导出的偏好设置。我们希望导出所有设置，因此我们将选择导出全部复选框。

4. 文件名必须以.epf（Eclipse 偏好设置文件）后缀结尾，这样就可以选择文件并在以后导入偏好设置。

5. 点击完成按钮以完成导出。

发生了什么？

现在，我们已经将所有偏好设置保存到了本地文件。如果您现在创建一个新的工作空间或设置 Aptana Studio 的新安装，您将能够恢复所有偏好设置。

但您如何将保存的偏好设置导入回来？看看这是多么简单。

操作时间 – 导入 Aptana Studio 偏好设置

1. 导航到文件 | 导入...。

2. 在窗口中选择通用 | 偏好设置条目，然后点击下一步。

3. 选择您想要导入的偏好设置。如果我们想导入之前导出的所有设置，我们将选择导入全部复选框。

4. 现在，您必须选择包含偏好设置的文件。

5. 点击完成按钮以完成导入。

发生了什么？

这非常简单。我们只是导入了之前导出的所有设置。让我们看看 Aptana Studio 并分析调整后的偏好设置的行为和外观。

例如，如果您已更改 Aptana Studio 的主题，您的新工作空间应显示该主题，并且所有其他偏好设置也应已恢复。

在不同工作空间之间切换

现在，您肯定想知道如何在不同工作空间之间切换。在不同工作空间之间切换与创建新工作空间一样简单。

操作时间 – 切换到另一个工作空间

1. 导航到文件 | 切换工作空间...，从列表中选择所需的工作空间。

2. 如果您所需的工作空间不在列表中，只需点击其他...。

3. 最后选择工作空间目录，然后点击确定以完成选择。

4. 在创建新的工作区时，Aptana Studio 会自动保存当前打开的工作区并关闭它。之后，Aptana Studio 会自动以新选择的工作区启动。

刚才发生了什么？

您刚刚通过单次选择切换了工作区、项目和偏好设置到另一个——如此简单，不是吗？

删除不必要的工区

删除现有工作区非常简单。您只需删除文件系统中的工作区目录即可。

注意

在您删除工作区之前，您必须切换到另一个工作区。如果您不这样做，Aptana Studio 将尝试使用已删除的工作区启动，并在找不到它们时崩溃。结果是 Aptana Studio 将无法再启动。如果发生这种情况，请参考第十二章，故障排除，以修复它。

行动时间——删除工作区

1. 打开 Aptana Studio，并确保您想要删除的工作区中没有包含您将来可能需要的项目或文件。

2. 切换到另一个工作区，就像我们在本章前面学到的。

3. 在您偏好的文件浏览器中导航到您的工作区，然后删除该目录。

刚才发生了什么？

您已从系统中删除了不再必要的工作区。

小贴士

同时从最近的工作区列表中移除工作区

为了从最近的工作区列表中移除已删除的工作区（您将在文件 | 工作区下找到该列表），请导航到窗口 | 首选项，并从通用选项卡下的启动和关闭选项中选择工作区树项。只需从列表中选择您已删除的工作区，然后点击移除。

工作区偏好设置

Aptana Studio 提供了许多偏好设置，以便根据您的需求调整工作区。您可以通过导航到窗口 | 首选项来找到所有这些设置。在本节中，您必须在左侧树中选择通用 | 工作区。因为 Aptana Studio 提供了很多偏好设置，所以我们无法检查所有这些。只需花时间仔细查看可用的偏好设置。我提到了一个有用的设置，该设置调整 Aptana Studio，使其每次启动时都会提示您选择工作区。

行动时间——在启动时提示选择工作区

如果您正在使用很多工作区，当 Aptana Studio 启动时选择了错误的工作区而不是您需要的工作区，有时会有些烦恼。

因此，您必须等待 Aptana Studio 启动完成，然后才能更改工作区。之后，您必须等待 Aptana Studio 再次关闭。之后，Aptana Studio 将以所需的工作区启动。这需要很多时间，每次都很烦人。

但幸运的是，你可以教会 Aptana Studio 在每次启动前询问你所需的要加载的工作空间。这可以通过执行以下步骤快速完成：

1. 导航到窗口 | 首选项并选择通用 | 启动和关闭 | 工作空间树项。

2. 现在选中启动时刷新工作空间复选框。

3. 应用更改并关闭首选项窗口，通过点击确定。

发生了什么？

我们更改了启动首选项，所以 Aptana Studio 会在每次启动前询问你想要在哪个工作空间中工作。如果你需要在不同工作空间之间多次切换，这个设置将为你节省很多时间。

快速问答 - 测试你新学到的项目知识

Q1. 文件应该以什么结尾才能成为首选项导出文件？

1. .epf

2. .pef

3. .ini

Q2. 在删除工作空间之前，你必须做什么？

1. 打开你想要删除的工作空间。

2. 关闭你想要删除的工作空间。

3. 关闭当前工作空间的全部视角。

与项目一起工作

在 Aptana Studio 中，一个项目就像是一组源代码文件，这些文件共同属于一个网络应用程序、网站或类似的东西。

但在我们开始创建第一个项目之前，让我们看看 Aptana Studio 提供的项目性质。

项目性质

项目性质允许我们指定项目的性质。通过为项目分配性质，你可以为其启用额外的功能。

项目性质有助于识别文件中存在的源代码类型。项目性质影响许多事情，主要是代码助手。

这主要取决于项目是如何被索引的；好吧，一些项目类型实际上是几个其他类型的组合，正如你可以在以下表格中看到的那样。所以，实际上，你可以在你的项目中拥有任何文件类型，但项目性质定义了在特定项目中不同文件是如何被评估的。现在，在以下表格中，你将找到一个具有特定性质的文件类型：

类型/性质	CSS	HTML	JavaScript	Ruby	ERB	PHP
Web	x	x	x
Ruby	x	x	x	x	x
Rails	x	x	x	x	x
PHP	x	x	x			x

如前表所示，PHP 性质的项目是为 PHP 开发量身定制的，Rails 性质的项目是为 Rails 开发定制的，Ruby 性质的项目是为 Ruby 开发定制的，Web 性质的项目是为 Web 开发定制的，使用 HTML、CSS 和 JavaScript 等技术。

如果你使用的是项目资源管理器视图，你可以通过扩展项目文件夹的小图标来识别项目的性质，如图所示：

创建新项目

现在我们想在我们的工作区中创建我们的第一个项目。Aptana Studio 提供了不同的方法来做这件事。最快的方法是使用工具栏。只需点击新建按钮左侧的小三角形。它显示为一个小的菜单，我们可以直接选择新项目的项目类型。

小贴士

快捷键

为了更快地创建一个新项目，你可以使用键盘快捷键 Shift + Alt + N。它直接提供一个选择菜单，类似于新菜单，你可以使用箭头键选择所需的项目类型。

因此，从选择项目类型的各种方式中，我们将选择此示例的 Web 项目。

打开此项目创建选择的一个替代方法是导航到 文件 | 新建。但显示的项目条目列表并不是所有可用项目的完整列表。如果你选择 项目... 项，你将收到一个包含所有项目类型的窗口。

现在我们可以通过点击 下一步 > 来跳到下一步，在那里我们可以为我们的新项目选择一个模板。

在选择项目模板后，我们将进行下一步，在那里我们必须定义项目名称并选择其在磁盘上的位置。

好的，现在我们开始了。项目的名称应该清楚地描述项目包含的内容。因此，我在 www 文件夹中的网络项目总是按照域名命名。默认位置是当前工作区中的一个文件夹，其名称与项目名称相同。

小贴士

自定义位置

有时候，将项目文件定位在工作区之外的位置是有用的。例如，你可能有一个本地、Apache 网络服务器正在运行，它始终在你的 www 文件夹中提供你项目的当前版本。没问题；只需将位置更改为工作区之外的文件夹，你的项目仍然会与你的工作区相关联。

小贴士

文件同步

作为默认设置，Aptana Studio 在 Aptana Studio 外发生修改时自动刷新或同步工作区中的文件。如果你想禁用此行为，只需导航到 首选项 | 通用 | 工作区 并取消选择访问复选框上的 刷新 按钮。

为了展示如何创建项目的另一个示例，我们将查看 提升到项目 功能。此功能允许你从文件系统中选择一个文件夹并将其转换为新的项目。

行动时间 - 使用提升到项目功能

1. 首先，导航到 项目资源管理器 视图。

2. 现在展开文件系统节点，导航到文件夹，它应该是一个项目。

3. 右键单击文件夹并选择 提升到项目... 选项。

4. 只需为新项目输入一个名称并选择与项目相关的性质。

5. 最后，点击完成以完成创建。

发生了什么？

现在我们已经通过使用提升为项目...功能将一个简单的文件夹转换成了一个项目。从此以后，你将在你的工作区中看到这个项目，但文件仍然位于它们的文件系统位置。

导入现有项目

如果你想从另一个 IDE 切换到 Aptana Studio，或者需要开发一个从其他开发者或项目获取的现有项目，该项目仍然集成在另一个工作区中，你可以选择将它们作为项目导入。

将项目导入到 Aptana Studio 中有两种常见方式：

• 将现有文件夹作为新项目导入

• 将现有项目导入工作区

现在我们将查看这两个函数。

操作时间 – 将现有文件夹作为新项目导入

1. 导航到文件 | 导入...。

2. 选择通用 | 将现有文件夹作为新项目并点击下一步。

3. 选择项目所在的文件夹。使用浏览...按钮，导航到源代码文件夹，然后点击确定。

4. 现在在项目名称字段中为新项目输入一个名称。

5. 选择你的项目的项目类型。

6. 最后，通过点击完成来完成导入。

发生了什么？

我们现在已创建了一个基于现有源代码基础的新项目。你将在你的项目资源管理器或应用资源管理器视图中找到新项目。

但在后台发生了什么？源代码文件夹仍然位于相同的位置。Aptana Studio 只是在源代码文件夹的根目录中添加了一个名为.project的隐藏文件，并将项目与你的工作区连接起来。

然而，现有项目的导入也进行得很快。所以，例如，你可以将同一个项目集成在不同的工作区中。

操作时间 – 将现有项目导入工作区

1. 导航到文件 | 导入...。

2. 选择通用 | 将现有项目导入工作区并点击下一步。

3. 选择你想要导入项目的位置。这可能是一个目录或存档文件，但选择方法相同。我们想要使用选择根目录选项，并通过浏览...按钮选择源。

4. 现在，你将能够依次选择多个项目并将它们收集在列表中。

5. 在我们选择了所有必需的项目后，我们必须决定是否将项目源代码复制到我们的工区，或者项目仍然保持在当前位置。

6. 如果我们愿意，我们可以将我们的项目添加到工作集中。

7. 最后，您必须通过点击完成来结束导入过程。

发生了什么？

目前我们已一次性将几个项目导入到我们的工区中。如果我们查看项目资源管理器视图，我们会看到所有选定的项目都已成功导入。

删除现有项目

有时候可能会发生这样的情况，您有一个不再必要的项目。那么让我们看看我们如何删除一个项目。

操作时间 - 删除项目

1. 导航到项目资源管理器视图。

2. 右键单击您想要删除的项目，并选择删除选项。

3. 出现一个对话框询问您是否想要同时删除文件系统中的文件。如果您不勾选复选框，Aptana 将仅从您的工区中删除项目。

4. 最后，如果您确定要删除项目，请点击确定。

发生了什么？

您已从您的工区中删除了一个项目，并且根据您是否决定在文件系统中删除文件的决定，源代码也将被删除。

更改项目的类型

如果您想更改或添加与项目关联的类型，也许是因为您已创建了一个作为 Web 项目的项目，现在您想向其中添加一些额外的 PHP 代码，请参阅以下操作时间 - 更改项目的类型部分。

操作时间 - 更改项目的类型

1. 首先，导航到项目资源管理器视图，然后右键单击您想要更改类型的项目。

2. 在项目上下文菜单中，点击属性，然后在对话框的左侧选择项目类型。

3. 选择最适合您项目的类型。

4. 如果您选择多个类型，您将能够通过点击相关类型的设为默认按钮将该类型设置为默认类型。

5. 最后点击确定。为了使类型的更改立即生效，只需在出现的对话框中点击是，Aptana 将重新打开您的项目。

发生了什么？

在 Aptana Studio 重新打开您当前更改的项目后，项目的类型将被假定，项目将提供相应的附加功能。

关闭或打开项目

如果您的工区随着越来越多的项目而增长，Aptana Studio 的性能可能会越来越慢，因为系统解析器，如错误或样式检查器，有更多的事情要做。因此，关闭当前不需要的项目是最佳实践。

当项目在您的 workspace 中关闭时，它将无法更改。关闭项目的资源在 workspace 中不再可见，但它们仍然在文件系统中。因此，如果项目已关闭，Aptana Studio 中所需的内存会更少。您还可以通过关闭项目来提高构建时间，因为关闭的项目在构建过程中不会被检查。

小贴士

改进启动时间

如果您在完成工作后以及在关闭 Aptana Studio 之前关闭项目，那么当您以打开项目启动 Aptana Studio 时，下一次启动将会更快。

因此，让我们看看如何在项目资源管理器视图中关闭和重新打开项目。

行动时间 – 关闭项目

1. 导航到项目资源管理器视图。

2. 右键单击您想要关闭的项目并选择关闭项目。

就这样；您现在已经关闭了项目，项目根节点的图标已切换到关闭文件夹的图标。

作为一种反向功能，您也可以在项目上下文菜单中点击关闭无关项目条目，这将关闭您工作空间中与所选项目无关的所有项目。

如果您想重新打开一个项目，您也可以以相同的方式操作。只需右键单击您想要重新打开的项目，并选择打开项目。

在处理大型项目以及处理大量项目时提高性能通常很成问题，但如果您正在处理非常大的项目，那么问题将会更加严重。如果您的项目太大，Aptana Studio 可能会变得非常缓慢。

现在我们将看看如何通过处理大型项目来提高性能。

解决这个问题的方法是将大型项目从索引中排除。

行动时间 – 从索引中排除项目

1. 打开项目资源管理器或应用资源管理器视图。

2. 选择您需要提高性能的项目。

3. 右键单击并选择索引 | 从索引中排除。

   通过选择从索引中排除选项，您已经标记了项目，这样 Aptana Studio 就可以排除包含的文件进行索引，并帮助提高性能。

提高性能的另一种可能性是禁用自动构建选项。这比之前从索引中排除项目的选项更容易。

1. 导航到菜单项目 | 自动构建。

2. 取消选择菜单条目。

现在，我们已经禁用了自动构建选项。这意味着在文件中保存时不再触发项目的构建。

在项目中创建新文件

现在我们已经创建了不同项目性质的一些项目，是时候在我们的项目中创建一些新的源代码文件了。

行动时间 – 创建新的项目文件

1. 导航到应用资源管理器或项目资源管理器视图，并选择您想要添加文件的项目。

2. 右键单击项目并选择新建 | 文件以打开新建文件窗口。

3. 如果你想通过模板创建一个新文件，一个替代的方法是选择新建模板 | 编程语言 | 模板文件。

4. 在新建文件窗口中，在屏幕顶部的文本框中指定父文件夹。

5. 在文件名字段中输入新文件的名称。确保不要忘记添加适当的扩展名，例如，.html、.css或.js。

6. 最后，只需单击完成按钮即可完成创建。

刚才发生了什么？

经过这个过程，文件将被创建并添加到你的项目所选位置。此外，Aptana Studio 将在关联的编辑器中打开新文件，这样你就可以直接开始编码。

动手实践英雄 - 创建至少包含两个不同项目的自己的工作区

在阅读本章后，你的任务是创建你自己的系统工作区。如果你完成了，开始创建具有不同项目性质的一些项目。到那时，你必须至少有一个 Web 项目和 PHP 项目。当项目创建完成后，继续在 Web 项目（HTML、CSS、JavaScript 文件）和 PHP 项目（PHP 文件）中创建一些适当的文件。

此外，你可以尝试使用提升为项目功能，从你的文件系统中现有的源代码文件夹创建项目。

快速问答

Q1. 如果你在工作区中使用许多项目，你该如何提高性能？

1. 打开所有可用的项目。

2. 删除所有不必要的项目。

3. 关闭所有不必要的项目。

Q2. 如果你在工作区中使用一些大型项目，你该如何提高性能？

1. 将文件夹或整个项目包含到索引中。

2. 从索引中排除大型项目或文件夹。

3. 删除你不再需要的最大项目中的所有文件。

摘要

完成本章后，你应该熟悉不同的工作区项目。

你应该能够创建工作区并在它们之间切换。你应该知道如何导出和导入 Aptana Studio 首选项，以便在创建新工作区后能够恢复它们。

此外，你应该能够创建项目并根据你的需求调整它们的性质。此外，你应该知道如何提高工作区的性能。

总的来说，我们可以这样说，我们已经准备好开始下一章，学习如何在 Aptana Studio 中调试 JavaScript 项目。

第四章：调试 JavaScript

现在，当我们已经创建了我们的工作空间和项目后，我们可以开始使用 Aptana Studio。当然，您已经创建了自己的项目，其中包含一些用于您的 Web 应用程序或网站的文件。

因此，在本章中，我们将查看以下内容：

• 安装 Aptana Studio 调试器扩展

• 使用调试控制台

• 使用断点

• 监控 AJAX 请求

• 卸载调试器扩展

调试视角

在我们开始调试应用程序之前，我们必须做的第一件事是切换到 Window | Open Perspective | Debug 下的 Debug 视角。Debug 视角包含几个有用的视图，如 Console 视图、Debug 视图、Breakpoints 视图等，这些对于 JavaScript 调试来说非常完美。

但首先，让我们从安装调试器扩展开始，这对于调试是绝对必要的。

安装 JavaScript 调试器

为了使用 Aptana Studio 调试一些 JavaScript 代码，我们需要为我们的浏览器安装所需的扩展。调试器扩展目前仅适用于 Firefox 和 Internet Explorer。

我们想要安装用于 Firefox 浏览器的 Debugger 扩展 程序。

安装 Aptana Debugger for Firefox 的行动时间

1. 启动您的 Firefox 浏览器。如果您还没有安装 Firefox，请现在安装。

2. 安装 Firefox 的 Aptana Debugger 扩展。您可以在 firefox.aptana.com/update/aptanadebugger.xpi 找到它。点击此链接，Firefox 将自动开始安装。只需您的确认和重新启动 Firefox 即可。

3. 安装扩展后，导航到 Firefox | Add-ons 并查看您的 Aptana Debugger 版本的要求数据。

4. 在我们的案例中，Aptana Debugger 1.7.2 需要 Firebug 1.2 到 1.8。现在导航到 www.getfirebug.com 并安装根据您当前安装的 Firefox 版本所需的 Firebug 扩展。我们导航到网站 getfirebug.com/releases/firebug/1.8/ 并安装最高要求的 Firebug 版本 1.8。

   小贴士

   已经安装了 Firebug 的新版本？

   如果您已经安装了 Firebug 的新版本，您需要卸载它并安装所需的版本之一。这可能是意外的，因为 Firebug 的新版本提供了许多很好的功能。在这种情况下，您可能需要安装第二个（较旧）版本的 Firefox，您只使用它进行 Aptana Studio 调试。

5. 安装完两个扩展后，重新启动 Firefox 以完成安装。

刚才发生了什么？

你已经为使用它来调试 Aptana Studio 项目准备了 Firefox 浏览器。具体来说，这意味着你已经集成了 Aptana 调试扩展和所需的 Firebug 扩展。

注意

强烈建议 Firebug 扩展与 Aptana 调试扩展兼容。

配置调试器

Aptana Studio 为你提供了配置许多不同调试配置的选项。例如，如果你安装了不同版本的 Firefox 或 Internet Explorer 的本地版本，你可以为这些浏览器中的每一个创建一个调试配置，这样你只需在工具栏上单击一次即可开始在这些浏览器中调试你的代码。

执行动作 – 创建调试配置

1. 为了创建调试配置，我们点击调试工具栏按钮右侧的小三角形，以展开调试菜单并选择条目调试配置…。

2. 点击配置窗口左上角的新建启动配置按钮（一个白色纸张符号）。

3. 当 Studio 在左侧树中的Web 浏览器节点下方插入配置条目后，将调试配置的名称输入到右上角的名称字段中。例如，我们输入名称Firefox - 内部服务器。![执行动作 – 创建调试配置]

4. 在主标签页中选择一个浏览器，我们的调试功能将在其中运行。例如，我们输入 Firefox 的路径，/usr/bin/firefox。

5. 此外，我们希望开始在当前页面上启动调试器；因此，我们在启动操作部分选择使用当前页面选项。

6. 我们选择使用内置 Web 服务器条目，因为我们的第一个简单调试配置应该使用内部 Web 服务器。

7. 之后，只需点击应用以保存配置的第一个设置。

8. 此外，我们希望我们的调试配置应出现在工具栏中的调试菜单下。因此，我们在常用选项卡和显示在收藏夹菜单中列表中的调试条目中选择。

9. 最后，点击应用以保存更改，然后点击关闭以完成创建。

发生了什么？

我们已经创建了一个调试配置，此外还可以直接在工具栏中选择它。当你选择此配置时，Aptana Studio 将打开相关的浏览器并开始调试。

调试 JavaScript

在我们创建了 JavaScript 调试所需的配置后，让我们继续看看我们如何调试 JavaScript 文件。

执行动作 – 调试 JavaScript

1. 首先，点击调试工具栏按钮，以便调试当前打开的文件。

2. 如果你还没有安装调试器扩展，你会收到以下消息：

3. 在这种情况下，只需点击是，Aptana Studio 就会在后台直接安装它。快速且成功安装后，你会收到相应的消息，点击确定后可以继续。

   注意

   如果在调试器扩展安装期间 Firefox 正在运行，你可能需要重新启动 Firefox。如果在安装期间 Firefox 正在运行，并且你没有重启就继续，你会收到一个套接字连接错误的错误消息。请尝试关闭并重新启动你的网络浏览器，然后再次运行调试。

4. 现在，下次 Firefox 启动时，你会收到另一个程序想要使用以下插件修改 Firefox的消息。在这里，我们必须选择允许此安装并点击继续。

5. 为了完成 Firefox Aptana 调试器扩展的安装，你必须再次重新启动 Firefox。

6. 最后，调试过程应该在简单的浏览器中运行你的脚本。

发生了什么？

我们已经调试了第一个 JavaScript 代码。但在这一过程中，我们没有看到任何引人注目的变化——一切行为都像往常一样。

这是因为我们还没有设置断点或任何其他调试操作。但因为我们确实想这么做，让我们看看调试器为我们提供的调试代码的选项。

在我们继续前进之前，我们必须停止当前的调试过程。因此，我们点击终止视图按钮，它显示为一个红色方块，你可以在调试视图和控制台视图中找到它。或者，你也可以直接关闭运行调试过程的浏览器窗口。

控制台视图

控制台视图允许你在程序处理时打印一些日志条目。你可以在处理过程中直接打印值、类型等。

例如，以下操作仅在控制台视图中打印一条简单的消息：

// Just print a string
aptana.log('something to print');

// Print a string with some variable
aptana.log('this is the value: ' + variable);

这两个动作的输出看起来如下：

something to print
this is the value: helloWorld

控制台视图的另一种方法是trace方法。trace方法将在控制台视图中打印完整的回溯，这样你可以快速定位问题的位置。

aptana.trace(someVariable);

行动时间 - 使用控制台视图

1. 准备一个包含以下 JavaScript 代码的 HTML 文件：

   <script type="text/javascript">
       function someLoopWithinAFunction(loopEnd) {
           try {
               var someResult = 0;
               for(var i=1 ; i<=loopEnd ; i++) {
   
                   // Logging some variable value 
                   aptana.log(someResult + "+" + i);
                   someResult += i;
               }
   
               // Logging a simple variable by using backtrace
               aptana.trace("Backtrace a variable: " + someResult);
   
               // Logging an exception by using backtrace
               throw new Error("Some error happens");
   
           } catch(exception) {
   
               // Execute some backtrace
               aptana.trace(exception);
           }
           return someResult;
       }
       var result = someLoopWithinAFunction(5);
   
       // The finishing result
       aptana.log("The result is: " + result);
   </script>
   

2. 切换到调试视角。

3. 通过点击调试工具栏按钮来启动调试过程。

4. 一个 Firefox 窗口会自动打开并执行我们的 JavaScript 代码。

5. 现在，控制台视图包含所有日志值和回溯信息。

发生了什么？

我们刚刚执行了一些包含一个aptana.log和两个不同aptana.trace的 JavaScript 代码。控制台视图现在显示所有记录的值。

在前五行中，我们看到aptana.log的结果，这是在循环中调用的。这五个条目只记录计算。

接下来是第一个带有简单变量的回溯。这是一个非常有用的功能。正如你所看到的，变量的值被打印出来，后面跟着程序过程的完整回溯。你可以看到所有依次调用的函数，并在控制台视图中列出。在这种情况下，每个函数调用都显示文件名和相关的行号，这样你可以快速找到它们的位置。此外，你还可以双击这个文件名，编辑器会自动跳转到该函数。

第二个回溯显示了如何将回溯与异常结合起来，这样在出现问题时你总是能得到足够的信息。

最后，如果你经常使用aptana.log和aptana.trace，这里有一个警告。最常出现的错误之一是，在 JavaScript 代码中忘记调用aptana.log()或aptana.trace()。在正常的调试过程中，这并不总是显而易见的——但是如果你直接在浏览器中执行 JavaScript 代码（没有调试控制台），你会得到一个“Aptana 未定义”的错误信息。

这是正确的，因为 Aptana Studio 的库不再包含在内。所以为了优化你的代码并防止这种错误，你可以在一个单独的函数中包装 Aptana 函数，该函数检查 Aptana 的库是否可用。这可以像以下代码那样：

<script type="text/javascript">
    function myLog(value) {
        if(typeof aptana != "undefined") {
            aptana.log(value);
        }
    }
    function myTrace(value) {
        if(typeof aptana != "undefined") {
            aptana.trace(value);
        }
    }
    var logValue = new Date();
    myLog(logValue);
    myTrace(logValue);
</script>

使用断点

断点视图会给你一个关于你在当前工作区中设置的断点的概述。在下面的屏幕截图中，你可以看到断点视图，代码的第 11 行有一个断点：

但是，什么是断点，为什么你应该设置它？

断点是在你的源代码中的一个确切位置，调试器应该在这里停止执行。例如，如果你的代码中有一个动作循环，但代码中的某个地方出了问题（可能是你的变量；它们得到坏值或不正确的类型）。在这种情况下，你可以在循环中设置一个断点，并精确地查看所有变量值以及它们在每个周期中的变化。

注意

如果你在一个行上设置断点，执行总是在该行本身执行之前停止。

对于“动作时间 - 添加断点”部分，我们需要以下 JavaScript 代码：

function someLoopWithinAFunction(loopEnd) {
    var someResult = 0;
    for(var i=0 ; i<loopEnd ; i++) {
        someResult += i;
        aptana.log("i: " +i); // Add a breakpoint here
    }
    return someResult;
}
var result = someLoopWithinAFunction(5);
aptana.log("result: " +result);

动作时间 - 添加断点

1. 打开一个包含 JavaScript 标签的 JavaScript 文件或 HTML 文件，并复制其中的 JavaScript 代码。

2. 搜索在此处添加断点行，并在行号左侧单击鼠标右键。

3. 选择切换断点以设置断点。

4. 或者，您也可以在您右键单击的位置双击。

5. 在调试器中执行文件。

发生了什么？

我们刚刚手动在循环中的一行上设置了断点，调试器应该在每次循环中停止，这样您就可以检查脚本环境的当前状态。

提示

恢复断点

如果您想恢复断点，您可以简单地按F8。

如果您查看控制台视图，您会看到以下输出：

i: 0
i: 1
i: 2
i: 3
i: 4
result: 10

如您所见，调试器在每个循环周期中打印i变量的当前值，以及计算结果的最终结果。

注意

调试器仅在放置在具有可执行源代码的行上的断点处停止。如果您在空行上设置断点，调试器将忽略它。

如果您在脚本中放置了多个断点，而在脚本的实际执行中不需要其中一些，您可以选择禁用您的断点。

操作时间 – 禁用断点

1. 打开断点视图并搜索不必要的断点。

2. 取消选中断点条目左侧的复选框。

3. 或者，您也可以在编辑器中搜索断点行。

4. 在行号旁边的蓝色断点上单击鼠标右键。

5. 选择断点属性…并取消选中启用复选框。

6. 最后，单击确定。

发生了什么？

您通过使用断点视图并在编辑器的行号旁边选择断点属性…来禁用断点。

提示

识别禁用断点

要在整个 IDE 中识别禁用和启用断点非常容易。禁用断点始终以白色点显示，启用断点始终以蓝色点显示。

操作时间 – 在断点上设置命中次数

1. 搜索我们当前放置断点的行。

2. 在相关行号左侧的蓝色断点上单击鼠标右键。

3. 选择断点属性…条目。

4. 选择命中次数复选框并输入数字3。

5. 在调试器中执行文件。

发生了什么？

现在我们调整了断点，使其不仅仅在第三次到达时停止。

如果您已经知道您循环中的问题在第三次循环时首次发生，这将非常有用。现在调试器也会在您想要查找问题的循环中停止。

提示

使用命中次数或条件来识别断点

通过与断点视图和编辑器一起工作，您可以通过点左侧的小问号始终使用命中次数或条件来识别断点。

如果您想查找错误，变量 视图非常有用。变量 视图显示所有变量及其值，以及变量定义的类型和变量在当前断点作用域中的实际类型。为了选择显示的列，您可以导航到 视图菜单 中的 布局 | 显示列。

注意

变量 视图仅在断点停止您的 JavaScript 时显示信息。

行动时间 – 在断点处检查变量并更改它们的值

1. 执行最后调试的 JavaScript 代码，并设置 Hit Count 断点。

2. 当脚本在断点处停止时，在 Aptana Studio 中打开 变量 视图。

3. 查看变量列表并检查它们是否正确。

4. 双击 loopEnd 变量的值，将其从 5 更改为 7。

5. 按 Enter 键以接受新值。

6. 之后，按 F8 键以继续调试过程。

发生了什么？

现在您已检查了断点处的当前变量，并将 loopEnd 变量更改为新值。通过完成脚本，控制台 视图应该有如下输出：

i: 0
i: 1
i: 2
i: 3
i: 4
i: 5
i: 6
result: 21

如您所见，脚本直接假设新的变量值，并现在执行了七个循环。

Studio AJAX 监视器

如果您正在开发一个在整个执行过程中发送大量 AJAX 请求的应用程序，了解返回的数据类型通常是必要的。为此，Aptana Studio 提供了 Studio AJAX 监视器，在其中您可以跟踪所有 AJAX 请求及其响应。

Studio AJAX 监视器 由三部分组成。首先，是所有请求的概述。在这里，您可以查看哪个 URL 使用哪种方法请求，以及请求的时间。

另外两部分分别是请求信息和响应信息的一部分。它们都分别位于 头部 区域和 主体 区域，您可以在这里详细检查 AJAX 请求。

对于 行动时间 – 安装调试器扩展 部分，我们需要一个像以下这样的小脚本：

function testXHR() {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open("GET", "debug_ajax.html", true);
    xmlhttp.setRequestHeader("variable", "value");
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState==4) {
            aptana.log("responseText: "+xmlhttp.responseText);
        }
    }
    try {
        xmlhttp.send("Debug AJAX");
    } catch(exc) {
        dump("XMLHttpRequest exception: " + exc);
    }
}
testXHR();

行动时间 – 卸载 Aptana 调试器扩展

1. 打开一个包含 JavaScript 标签的 JavaScript 文件或 HTML 文件，并将 JavaScript 代码放置在其中。

2. 执行调试并打开 Studio AJAX 监视器 视图。

3. 现在浏览器执行 AJAX 请求，我们能够在 Studio AJAX 监视器 视图中检查它们。

4. 查看视图中列出的 AJAX 请求。

发生了什么？

您已发送了一个简单的 AJAX 请求，该请求直接列在 Studio AJAX 监视器 视图中。在这里，您可以检查请求，它在何时开始，发送了什么类型的头部，以及响应中包含哪些数据。

卸载调试器

也许你想卸载 Aptana Studio 或其他软件，并且你也想卸载 Aptana 调试器。

让我们看看如何卸载 Aptana Firefox 扩展。

行动时间 - 卸载 Aptana 调试器扩展

1. 打开 Firefox 并导航到 工具 | 附加组件。

2. 选择 扩展 部分。

3. 选择 Aptana 调试器 扩展，然后点击 移除。

4. 最后重新启动 Firefox。

刚才发生了什么？

我们刚刚从你的 Firefox 中移除了 Aptana 调试器扩展。现在该扩展不再可用。

尝试一下英雄 - 选择一个你未编写的 JavaScript 文件，并使用调试器检查其功能

现在你的任务是前进并选择一个由其他开发者编写的 JavaScript 文件。将其集成到一个简单的 HTML 包装文件中，并尝试检查其功能。使用 断点 和 日志 函数来学习脚本是如何工作的。

快速问答

Q1. 如果你想在 控制台 视图中打印回溯，你必须调用哪个函数？

1. aptana.log() 函数。

2. aptana.print() 函数。

3. aptana.trace() 函数。

Q2. 为什么当你的应用程序进入公共使用时，有必要移除所有 Aptana 函数？

1. 因为所有使用你应用程序的用户都收到了你的调试消息。

2. 因为所有使用你应用程序的用户都收到了错误消息，因为在非调试器使用情况下，Aptana 对象不可用。

3. 没有必要移除 Aptana 函数。脚本有或没有它都能正常工作。

Q3. 为什么你不在空行内放置断点？

1. 因为调试器会在此行停止调试。

2. 因为调试器会忽略断点，脚本将继续执行。

3. 没有理由。在空行上放置断点也能正常工作。

Q4. 禁用的断点是什么颜色？

1. 禁用的断点是红色。

2. 禁用的断点是蓝色。

3. 禁用的断点是白色。

摘要

到本章结束时，你应该能够调试你的 JavaScript 代码。这意味着，你应该知道如何设置和移除断点，以及如何找到可用的断点。

如果断点在代码中停止执行，你应该知道如何检查你应用程序当前状态下的变量。

现在，我们准备开始下一章，我们将探讨如何记录我们的 JavaScript 文件和项目。

第五章：代码文档和内容辅助

编写代码文档非常重要。众所周知，当接手扩展或修改其他开发者的脚本任务时，在开始工作之前，他们必须理解脚本的流程并了解开发者的思路。当其他开发者的源代码有良好的文档时，这将变得容易得多。

但有时也会发生这样的情况，您必须处理的是自己开发的脚本，但这已经是很久以前的事情了，所以您已经不再详细记得功能了。

因此，建议您始终在开发阶段对脚本（文件、类、属性、方法、函数）进行文档记录。在这个阶段，您对功能有最深入的了解。因此，Aptana Studio 理解 ScriptDoc 并使用它与内容辅助功能结合使用。

在本章中，我们将探讨以下内容：

• ScriptDoc 是什么以及它提供的标签

• 创建通用文档注释

• 使用内容注释片段并使用内容辅助功能结合使用

ScriptDoc

ScriptDoc 是一个工具，它从 JavaScript 文件中提取所有文档，并将这些信息提供给 Aptana Studio，以便它可以生成内容辅助功能的内容。ScriptDoc 自动扫描您的项目以查找 ScriptDoc 文档块，并使用内容辅助功能显示信息提示。例如，一旦为函数创建了一个 ScriptDoc 注释，内容辅助功能就会知道您的新函数，并在您在项目中的某个地方使用该函数时向您显示信息。

但这样的注释究竟应该是什么样子呢？

ScriptDoc 注释以 /** 开始，并以正常的多行注释 */ 结束。在这两个标记之间，您可以插入一些标签来描述您的文档注释。

以下表格为您提供了一个可用标签的小概览，您可以使用这些标签来记录您的代码：

标签	定义和示例	适用范围
@alias	定义类或函数的 ID。示例：* @alias aliasName	任何
@author	定义类的描述。示例：* @author Thomas Deuling tdeuling@domain.com	任何
@classDescription	定义类的描述。示例：* @classDescription Description ...	函数
@constructor	定义一个函数是一个类的构造函数。示例：* @constructor	函数
@deprecated	定义一个函数或属性已弃用。示例：* @deprecated	函数和属性
@example	定义一个示例。示例：* @example Example code	任何
@exception	定义一个函数抛出的异常。示例：* @exception {TestException} ThrowDescription	函数
@id	允许您将函数或属性的文档链接到外部 ScriptDoc 文件。例如：/** @id */	任何
@inherits	定义一个函数继承自另一个函数。例如：* @inherits functionNameA, functionNameB	函数
@internal	定义一个函数或属性不应在内容辅助功能中可见。例如：* @internal	函数和属性
@memberOf	定义一个函数是某个类的成员。例如：* @memberOf className	函数和属性
@method	定义一个函数是一个类的成员方法。例如：* @method	函数
@namespace	为文件定义一个命名空间。例如：* @namespace coding.ms	文件
@param	定义函数的参数。例如：* @param {String} paramName 描述	函数
@private	定义一个函数或属性是私有的。例如：* @private	函数和属性
@projectDescription	定义文件描述。它必须是第一个文档块中的第一个标签。例如：* @projectDescription 描述文本 ...	文件
@property	定义类的属性。例如：* @poperty {Array} 数组用于 ...	文件
@return	定义返回值的类型和描述。例如：* @return {Object} 返回描述	函数
@see	链接到相关的类或函数。示例链接到函数：* @see #functionName示例链接到类：* @see className示例链接到方法：* @see className#methodName	任何
@since	定义主题是在哪个版本中创建的。例如：* @since 1.0	文件、函数和属性
@type	定义属性的 数据类型。例如：* @type {Object} 对象描述	属性
@version	定义文件或类的版本。例如：* @version 1.1	任何

这些 ScriptDoc 标签为您提供了良好的代码文档基础，这样几乎所有的其他开发者都能理解您的脚本有什么用途。

在以下部分，我们将查看文件、函数和属性的注释看起来是什么样子的。

JavaScript 文件注释

首先，我们将查看文件注释。文件注释应包含 @projectDescription 和 @author 标签，这些标签描述了文件中的源代码类型以及谁编写了它。此外，还可以有 @namespace、@since 和 @version 标签，这样每个人都知道代码在哪个命名空间中可访问，以及文件自哪个版本以来存在，以及当前版本是什么。

@property 标签也很有用，应该为每个显著的属性添加。

以下是一个常见的文件注释：

/** 
 * @projectDescription File description
 *
 * @author    Thomas Deuling tdeuling@domain.com
 * @namespace coding.ms
 * @version   1.1 
 * @since     1.0
  *
 * @property  {String} 
 */

注意

不要忘记，带有 @projectDescription 标签的文件注释必须是 JavaScript 文件中第一行内的第一个文档块。

JavaScript 属性注释

接下来是属性注释，它描述了一个类的属性。因此，如果您正在编写包含一些属性的类，您应该用描述其目的的描述来记录它们。如果属性是类的私有属性，您应该使用@private标签。但@since和@type标签也很有用，并帮助每个人了解类有多少时间有这个属性以及它的类型。

这里是一个常见的属性注释：

/**
 * Property description
 * @type {Object}
 * @private
 * @since     1.0
 */

JavaScript 函数注释

现在，最后，是函数注释。

它可以用于函数或方法。如果函数是方法，则注释包含@method标签。此外，还可能有@constructor标签，它定义了该方法是该类的构造函数。但在任何情况下，注释都应该包含@author和@since标签，以便清楚地知道谁编写了该函数以及为您的应用程序的哪个版本。此外，您应该为每个函数参数创建一个@param标签。这些@param标签包含参数的类型、变量名以及用例描述。最后，如果有，@return标签（如果有的话）描述了函数返回的数据类型。

最后，一个常见的函数注释示例：

/**
 * Function description
 *
 * @param  {String} paramName Description
 * @return {Object} Return description 
 * @author    Thomas Deuling tdeuling@domain.com
 * @since     1.0
 */

操作时间 - 显示函数注释

现在，让我们看看如何显示这些函数注释。

1. 创建一个包含以下内容的 JavaScript 文件：

   /**
    * This function does something
    *
    * @param  {String} aStringParam String for...
    * @return {Object} Return the result object
    * @author    Thomas Deuling aptana@coding.ms
    * @since     1.0
    */
   function doSomething(aStringParam) {
       // ...do something
       return new Object();
   }
   doSomething();
   

2. 保存文件。

3. 将鼠标悬停在函数调用上。

发生了什么？

我们刚刚创建了一个带有 ScriptDoc 注释的函数。通过将鼠标悬停在以下截图中的该函数的函数调用上，如第 16 行，Aptana Studio 会显示一个包含 ScriptDoc 注释信息的工具提示：

小贴士

信息工具提示在哪里？

如果在将鼠标悬停在函数调用上时没有出现信息工具提示，请转到窗口 | 首选项，然后转到Aptana Studio | 内容辅助。在这个区域，您必须选择悬停时显示信息选项。

内容辅助功能

内容辅助功能为您提供有关属性、方法和函数的信息。相关信息以工具提示的形式显示，正如我们在“操作时间 - 显示函数注释”部分中看到的那样。当工具提示中的信息大于可用的工具提示空间时，只需在光标位于函数或对象上时按F2键，工具提示就会变得粘性，这样您就可以在工具提示内滚动。

操作时间 - 使用内容辅助功能

内容辅助功能会自动弹出，并提供一个上下文菜单，其中您可以查看当前作用域中可用的对象、函数等。

1. 按照在“操作时间 - 显示函数注释”部分中提到的步骤打开 JavaScript 文件。

2. 将光标放在文件中的任何位置。

3. 开始输入一个函数或对象名称。例如，我们想使用文档对象，因此我们按下字母D。

4. 现在，内容辅助功能为你提供了一个上下文菜单，列出了所有以字母“d”开头的可用对象和函数。

   小贴士

   手动触发内容辅助功能

   如果你需要内容辅助功能但它没有自动出现，你可以通过使用快捷键Ctrl + 空格键手动触发它。

5. 使用上箭头和下箭头键选择所需的条目，或者输入更多字母以获得更精确的结果列表。我们选择了文档对象。

6. 如果你已选择了所需的条目或只剩下一个条目待选，只需按下Tab键插入所需的代码。

7. 在将文档对象插入并输入点以从文档对象调用方法之后，内容辅助功能重新出现，这次它为你提供了对象的所有可用方法。

发生了什么？

我们已经使用内容辅助功能完成了所需的语句，即使我们不知道相关对象上可用的属性细节。下面的截图显示了与Time for action – using the Content Assist部分相关的内容辅助功能。

浏览器功能

但内容辅助功能可以做更多。如果你必须为不同的浏览器编写代码，而这些浏览器你知道它们的功能非常不同，你需要知道哪个浏览器提供了哪些功能。如果你不知道，它会导致许多开发错误，仅仅因为你不知道特定的浏览器不支持某个功能。

对于这个问题，Aptana Studio 提供了一个额外的有用功能。如果你开始编写浏览器提供的对象（如文档对象）的语句，代码辅助会为你提供一个可用功能的列表。但如果你仔细观察，你会在每个条目的右侧看到很多浏览器图标。每个图标表示相关的浏览器是否理解该功能。当图标是全色的，表示该浏览器支持该功能；否则图标是灰色的，表示浏览器不支持该功能。如果没有可用的信息，内容辅助功能假定该属性是可用的。

动手实践 – 更改内容辅助功能使用的用户代理

1. 导航到窗口 | 首选项。

2. 在左侧树形结构中的Aptana Studio选项卡下选择内容辅助条目。

3. 在右上角选择你将设置提供用户代理的项目类型。

4. 在我们的例子中，选择Web条目。

5. 检查所需的浏览器并点击确定接受选择。我们选择了 Chrome、Firefox 和 Internet Explorer。

发生了什么？

我们选择了项目必须支持的网络浏览器。为了测试当前选择的浏览器，只需打开一个 JavaScript 文件并输入 document。查看内容辅助功能；现在它应该只显示列表中选定浏览器的图标。

另一个不错的功能是，你可以使用自己的代码使用内容辅助功能。如果你想使用自己的代码使用内容辅助功能，你必须文档化你的对象、方法和函数。

你还可以通过为每个注释创建代码片段来优化编写代码文档的过程。这些代码片段很容易通过使用内容辅助功能插入。

尝试一下英雄——为包含 JavaScript 代码的项目编写文档

现在，自己选择一个目前正在构建的小型 JavaScript 项目，并为所有对象、方法、函数和属性添加文档。完成后，检查内容辅助功能如何为你提供有关自己代码的信息。

快速问答

Q1. 如何编写文档注释块，以便 ScriptDoc 解析器能够解析它？

1. /**

2. /*

3. //

Q2. 带有 @projectDescription 标签的文件注释在 JavaScript 文件中必须位于何处？

1. 带有 @projectDescription 标签的文件注释必须是你的 JavaScript 文件中的最后一个文档块。

2. 带有 @projectDescription 标签的文件注释必须是你的 JavaScript 文件第一行的第一个文档块。

3. 位置无关紧要。

Q3. 显示函数注释需要采取什么行动？

1. 将鼠标悬停在函数调用上方。

2. 点击函数调用。

3. 右键点击函数调用。

Q4. 哪个快捷键使信息工具提示保持粘性，以便在工具提示内容不适合时，你可以阅读完整信息？

1. F2

2. Ctrl + S

3. F1

Q5. 哪个快捷键触发内容辅助功能？

1. Ctrl + Alt + Delete

2. Ctrl + F2

3. Ctrl + 空格键

摘要

到本章结束时，你应该能够编写你的 JavaScript 代码的文档，使其符合 ScriptDoc。此外，你应该详细了解如何编写 JavaScript 代码的文档，以便每个开发者都能理解你的脚本及其功能。

现在我们向前迈进，看看我们如何与 HTML 和 CSS 一起工作，并检查它们。

第六章. 使用 Firebug 检查代码

本章将向您展示如何检查您的代码。Aptana Studio 本身不提供检查代码的功能，但几乎每个浏览器都提供了一到多个用于此目的的优秀工具。在本章中，我们将探讨如何使用 Firefox 扩展 Firebug 来实现这一点。

在本章中，我们将详细探讨以下内容：

• 什么是 Firebug

• 检查网站的源代码

• 检查和编辑 HTML 代码

• 检查和编辑 CSS 代码

• 使用 Firebug 控制台

• 分析代码性能

什么是 Firebug

Firebug 是 Firefox 最受欢迎的扩展之一，它帮助您检查和调试网站。它已被下载超过 300 万次，并在 addons.mozilla.org 网站上获得 5 星评价。该 addons.mozilla.org 网站拥有大量的扩展，您几乎可以在这里找到任何 Firefox 扩展。

Firebug 正在持续开发中，并包含许多有用的功能，例如以下这些：

• 一个 控制台 模块，其中 Firebug 列出来自 JavaScript、CSS 等的错误、警告和跟踪信息。

• 一个 HTML 模块，您可以在其中检查和编辑当前显示网站的 HTML 代码。

• 一个 CSS 模块，您可以在其中检查和编辑当前显示网站的 CSS 代码。

• 一个 脚本 模块，您可以在其中检查和调试当前显示网站的 JavaScript 代码。

• 一个 DOM 模块，您可以在其中检查和更改当前显示网站的 文档对象模型（DOM）。

• 一个 网络 模块，您可以在其中监控所有网络活动并检查其请求和响应。

您可以在 getfirebug.com/ 下载 Firebug，在那里您将始终找到实际版本以及许多有用的东西，如文档或社区支持。

操作时间 – 安装 Firebug

在我们开始之前，我们需要安装 Firebug。

1. 启动 Firefox 并导航到 getfirebug.com，然后点击 安装 并之后点击 下载；或者直接导航到 addons.mozilla.org/en-US/firefox/addon/firebug/。

2. 点击 添加到 Firefox。

3. 通过点击 安装 来确认安装。![操作时间 – 安装 Firebug]

4. 最后，重新启动 Firefox。

发生了什么？

我们刚刚将 Firebug 扩展安装到 Firefox 中。安装成功后，您将在 Firefox 窗口的右上角找到 Firebug 菜单。

现在，我们可以开始探索我们的网站和 Web 应用程序。

正如您在前面的图片中看到的，Firefox 图标目前是灰色的。这意味着 Firebug 目前是禁用的。您可以点击此图标以打开和激活 Firebug。作为替代和更快的方式，您只需按下 F12。

如果 Firebug 处于活动状态，图标将以彩色显示。

行动时间——启用和配置 Firebug

那么，让我们开始使用 Firebug，看看如何启用和禁用 Firebug 的主要模块。

1. 打开 Firefox 并浏览任何网站。

2. 按F12以打开 Firebug。

3. Firebug 默认在 Firefox 的底部打开，并在左侧以 Firebug 符号的形式提供一个主菜单。在 Firebug 的顶部中心，你会找到一个标签栏，允许你在 Firebug 的主要模块之间切换。

4. 当激活每个模块标签时，它还有一个自己的菜单，你可以在这里激活一些特定的设置（看看标签标签右侧的小三角形）。

5. 你还必须知道，出于性能原因，控制台、脚本和网络模块可以被启用和禁用。如果此标签的标签是灰色，则模块当前已禁用；如果标签是黑色，则已启用。所有三个模块都可以通过它们各自的菜单启用和禁用。试试看吧！！

   小贴士

   禁用不必要的 Firebug 模块

   很不幸，Firebug 有点儿像内存吞噬者。如果你已经启用了所有 Firebug 模块，甚至可能打开了多个 Firefox 标签页，Firefox 很快就会使用几百 MB 的内存。所以最好禁用你现在不需要的所有 Firebug 功能。

发生了什么？

我们已经打开了 Firebug 在任何网站上，并查看配置 Firebug 及其标签页的可能性。此外，我们现在知道如何启用和禁用 Firebug 模块。

小贴士

独立窗口中的 Firebug

要在独立窗口中打开 Firebug，只需使用快捷键Ctrl + F12

检查 HTML 代码

我们想要详细查看的第一个模块是 HTML 标签。它不是 Firebug 标签行中的第一个，但它为我们使用 Firebug 提供了一个良好的起点。

在第一步中，我们将检查网站的 HTML 代码，并尝试选择特定的 HTML 标签。

行动时间——检查 HTML 代码

1. 打开 Firefox 并导航到任何网站，例如google.com。

2. 按F12以打开 Firebug。

3. 选择 HTML 标签。

4. 在左下角，你可以找到当前加载站点的完整 HTML 代码。

5. 在这里，你可以通过点击小加号图标来展开节点，在 HTML 树中进行导航。

6. 在 HTML 树中，鼠标悬停的 HTML 节点将在浏览器窗口中突出显示为蓝色。如果悬停的元素有边距（就像前面的截图中的顶部边距一样），它将被突出显示为黄色；如果悬停的元素有填充（就像截图中的底部填充一样），它将被突出显示为紫色。

7. 通过简单点击来选择 body 元素。如果你选择了一个元素，HTML 模块的右侧区域将显示有关该元素的信息。这个区域也被一个小标签组分隔，其中你可以找到我们在这个章节的检查 CSS 部分使用的 样式 标签，一个 计算 标签，你可以在下面的屏幕截图中看到（它包含来自元素的当前所有属性的列表），一个 布局 标签，你可以检查和调整所选元素的尺寸（边距、边框、填充以及元素本身），最后是 DOM 标签，你可以检查所有 DOM 属性。

发生了什么事？

我们已经使用了 Firebug 的 HTML 模块来检查一个网站。因此，我们打开了 Firebug，选择了 HTML 模块，并且还选择了我们想要检查的 HTML 元素。我们看到了网站的完整 HTML 树；进一步地，在 计算 标签中看到了所有 HTML 属性，在 布局 标签中看到了布局尺寸，在 DOM 标签中看到了 DOM 属性。

小贴士

为什么 HTML 视图中的一些属性有时会以黄色闪烁？

如果你正在检查一个由 JavaScript 驱动的网站，并且当前查看的 HTML 代码的作用域内有属性，这些属性在那个时刻正被 JavaScript 操作，Firebug 允许这些属性以黄色闪烁。

现在，我们想要看看如何使用 Firebug 来编辑或删除一些 HTML 代码。

行动时间 – 使用鼠标选择器编辑 HTML

1. 我们将从上一个 行动时间 部分结束的位置开始。所以，打开 Firefox，导航到任何网站，然后按 F12 以打开 Firebug。

2. 现在，如果你在网站上搜索特定的元素，你也可以使用鼠标选择器。这是一个蓝色的矩形按钮，里面有一个鼠标图标，位于 Firebug 主菜单的右侧。只需激活按钮，将鼠标移到网站上，以找到你想要检查的元素。一旦点击，该元素将在 Firebug 中被选中，并且鼠标选择器按钮将被禁用。

3. 当你选中一个元素时，你可以右键点击以打开上下文相关的菜单。在这个上下文菜单中，Firebug 为你提供了对所选 HTML 元素的一些操作。你可以附加新的属性，编辑元素节点，删除整个节点，或执行其他操作。

4. 在这一点上，我们使用鼠标选择器选择 Google 标志右侧的国家名称。之后，我们在选中的 div 节点上右键单击，并点击 编辑 HTML 按钮。

5. 现在，我们能够编辑包含所有其他节点的完整 HTML 节点。为了进行一个小测试，我们将 CSS 属性的颜色更改为红色。通过更改 HTML 代码，Firebug 会实时刷新网站，因此您可以直接看到更改的结果。

6. 如果您已经完成了所有更改，只需在左上角按 Edit 按钮即可完成编辑。

刚才发生了什么？

我们已经从一个网站中选择了一个特殊元素并对其进行了更改。我们看到了 Firebug 如何在当前网站中实时显示这些更改。

同样，就像我们现在编辑 HTML 代码一样，您也可以删除节点或快速添加单个属性。

因此，一个常见的流程是选择一个 HTML 节点并编辑它，编辑完成后，只需通过右键单击它来复制 HTML 节点。现在包含在剪贴板中的复制的 HTML 节点可以简单地粘贴到您的源文件中。

检查 CSS 代码

为了检查和编辑 CSS 代码，Firebug 主要提供了两种方法。第一种方法是在 HTML 模块的 Style 选项卡中。在这里，您可以检查和调整当前选定的 HTML 元素的 CSS 代码。另一方面，您也可以直接使用 CSS 模块。在 CSS 模块中，您可以直接在单个 CSS 文件的结构中检查和编辑 CSS 代码。

在这一点上，我们将查看两种处理 CSS 的方法。

实践时间 – 使用 HTML 模块编辑 CSS 代码

1. 我们就像在之前的 Time for action 部分做的那样重新开始。所以，打开 Firefox，导航到任何网站（我们再次使用 Google 网站），然后按 F12 以在 HTML 模块中打开 Firebug。

2. 通过右键单击 Google 标志右侧的国家名称来选择国家名称。

3. 现在 Firebug 显示了当前 HTML 元素的所有信息。我们选择 Style 选项卡，并详细查看 CSS 信息。

4. 如我们在 Style 选项卡中所见，元素接收到一个指令，将其字体大小增加三倍。您可以看到元素的哪个属性来自哪里。您还可以看到在每个元素块中它从哪里继承而来；在每个选择器部分中，选择器是在哪个文件和行号定义的。因此，从下到上，指令将被覆盖。

5. 现在，当我们想要调整标签的水平位置时，我们只需双击顶部定义的值。该字段变为可写状态，您就可以调整它。就像所有其他更改一样，结果将实时可见。

   小贴士

   调整值

   如果您想逐步调整值，您也可以使用键盘上的上箭头和下箭头键。

6. 当你完成修改 CSS 属性后，你也可以选择 CSS 代码并将其复制粘贴到你的源代码文件中。

刚才发生了什么？

我们检查了特殊 HTML 元素的 CSS 指令，并查看我们如何轻松调整这些值。

现在我们想看看另一种可能性，即使用 Firebug 检查 CSS 代码。

实践时间 – 使用 CSS 模块编辑 CSS 代码

1. 我们将再次从上一个 实践时间 部分开始。因此，我们打开 Firefox，在这个例子中，加载 aptana.com 网站。当网站完全加载后，按 F12 以在 CSS 模块中打开 Firebug。

2. 在 CSS 模块的头部，你可以看到一个文件区域，其中当前已选择 aptana.css 文件。如果网站中包含更多 CSS 文件，你可以更改显示的文件。

3. 在主区域中，你可以找到所选 CSS 文件的内容。就像在 HTML 模块中的 样式 选项卡一样，你可以更改所有属性或添加新需要的属性。

4. 最后，当你完成整个 CSS 文件的编辑后，只需按下 Ctrl + A 来选择整个 CSS 文件，使用 Ctrl + C 复制它，然后使用 Ctrl + V 在 Aptana Studio 的源代码文件中粘贴它。

刚才发生了什么？

我们检查了整个 CSS 文件中的 CSS 代码。在这里，你看到也可以在整个文件中编辑属性，并学习了如何复制完整的 CSS 内容，以便你可以直接将更改后的 CSS 代码粘贴到源代码文件中。

使用 Firebug 控制台

Firebug 控制台允许你读取记录的信息、警告、错误等。例如，你可以像我们在 第四章 中看到的 调试 JavaScript 一样，将 console.log() 写入你的 JavaScript 文件中以调试它们。

让我们看看控制台如何通过开发 Web 应用程序来帮助我们。

实践时间 – 使用 Firebug 控制台

1. 我们将再次从上一个 实践时间 部分开始。切换回 Firefox，导航到 aptana.com 网站，并按 F12 以在控制台模块中打开 Firebug。

2. 在控制台模块的头部，你可以找到一些按钮，允许你过滤显示的消息。

3. 所有消息都列在主区域中。正如你所见，已经列出了一个警告，因为该网站使用了一个已弃用的函数。

4. 在底部区域，你可以实时触发自己的操作。这有时非常有用。你可以触发自己的函数，或者尝试 jQuery 选择器，并检查哪些节点被匹配。通过输入 console.log (document.title) 来亲自尝试。

   小贴士

   输入多行命令

   如果你需要输入多行——没问题。只需按住命令行右侧的红色三角形图标，命令行就会移动到右侧的多行命令行。现在你也能够一次性将完整的脚本行粘贴到 Firebug 中并执行它们。

5. 另一个不错的特性是，控制台模块提供了你的命令历史记录。你可以通过点击命令行左侧的红色列表图标来显示之前的操作。此外，如果你将焦点放在命令行上，可以使用上箭头和下箭头键导航到之前的记录。

6. 你也可以在控制台模块中写入自己的消息、错误、警告或仅仅是调试信息。因此，Firebug 在控制台对象上提供了四个方法，如下所示：

   • console.log(object[, object, …])

   • console.error(object[, object, …])

   • console.warning(object[, object, …])

   • console.debug(object[, object, …])

7. 我们在这里想要展望的最后一个特性是完成建议（注意，此功能仅通过使用单行命令行可用）。如果你在单行命令行中输入 doc，控制台将建议你可能想要输入的对象或函数。如果有多个成功的建议，你可以使用键盘上的上箭头和下箭头键来选择你需要的。如果你的所需对象或函数已经暗示，只需按 Tab 键来选择它。

   提示

   你知道吗？

   控制台模块还能够进行计算。如果你正在创建布局，并且需要计算属性或尺寸，你不需要启动你的系统计算器。只需使用 Firebug 控制台即可。

刚才发生了什么？

我们已经检查了控制台模块的主要功能。现在你应该知道如何过滤输出并在运行时执行 JavaScript 命令。

代码性能分析

当你的开发工作向前推进，你的网络应用越来越大时，性能可能会越来越慢。这是由于浏览器必须执行的 JavaScript 代码量不断增加所导致的。

这是思考优化代码的最佳时刻。因此，你必须对你的源代码的许多部分进行性能分析，以找出哪些函数或代码块是最大的性能消耗者。

Firebug 提供了一些有用的功能，你可以使用它们来定位这些性能消耗者。

要找出单个代码块或函数的性能如何，一个简单的方法是将它包裹在 time 和 timeEnd 函数中。我们具体是如何做到的，将在下一节中讨论。

使用 console.time() 进行代码性能分析的时间到了

在本节中，我们将讨论使用 console.time() 函数进行代码性能分析的步骤。

1. 首先，我们需要一些可以分析的 JavaScript 代码。在这个简单的例子中，我们只使用一个小函数（包含一些需要一点时间的操作），如下面的代码所示：

   <script type="text/javascript">
   	function loop() {
   		var sum =0;
   		for(var i=0 ; i<1000 ; i++) {
   			sum += i*Math.random();
   		}
   		return sum;
   	}
   </script>
   

2. 我们将这个函数嵌入到一个 HTML 文件中。

3. 当我们现在想要确定执行时间时，我们必须将函数调用包裹在两个控制台函数中。第一个是用于注册开始时间，将由 console.time('unique_identifier') 设置。请注意第一个参数；这必须是每个分析的唯一标识符。

4. 之后，我们调用我们将要分析的函数。

5. 最后，我们必须注册我们的时间测量已完成。因此，我们必须调用第二个函数，它需要与第一个函数相同的唯一标识符 console.timeEnd('unique_identifier')。毕竟，我们的代码应该看起来像以下代码：

   <script type="text/javascript">
   	function loop() {
   		var sum =0;
   		for(var i=0 ; i<1000 ; i++) {
   			sum += i*Math.random();
   		}
   		return sum;
   	}
   	console.time('timer1');
   	console.log('loop: ', loop());
   	console.timeEnd('timer1');
   </script>
   

6. 现在，我们在 Firefox 中打开我们的 HTML 文件，并通过按 F12 打开 Firebug，然后打开控制台模块。

7. 可能我们需要启用控制台。如果是这样，我们必须通过按 F5 重新加载我们的网站。

8. 最后，我们查看控制台输出，看到我们的代码块执行耗时 4 毫秒。

发生了什么？

我们将函数调用包裹在 console.time() 和 console.timeEnd() 函数中，以确定我们的函数的确切执行时间。重要的是这两个包装函数必须获得相同的唯一参数，这是控制台用来识别计时器的。

另一种获取更多关于您的应用程序和性能损失最严重的位置的信息的方法是使用 console.profile 函数分析一些代码块或函数。

让我们在下一节中看看。

行动时间 - 使用 console.profile() 分析代码性能

在本节中，我们将讨论使用 console.profile() 函数分析代码性能的步骤。

1. 我们从上一个“行动时间”部分获取 HTML 文件并扩展 JavaScript 代码。

2. 首先，我们将 Math.random 函数调用移动到一个名为 getRandom 的单独函数中。我们这样做是为了在我们的循环函数中创建更多的函数调用。

3. console.time 和 console.timeEnd 函数不再需要；但不要删除这些行。console.profile 函数的工作方式类似。

4. 因此，我们将 console.time 函数更改为 console.profile 函数。唯一标识符仍然是必需的，因为您可以在同一时间运行多个分析。

5. 这一步有助于将 console.timeEnd 函数更改为 console.profileEnd 函数——就这样。经过所有这些步骤，您的代码应该看起来像以下这样：

   <script type="text/javascript">
   	function loop() {
   		var sum =0;
   		for(var i=0 ; i<100 ; i++) {
   			sum += i*getRandom();
   		}
   		return sum;
   	}
   	function getRandom() {
   		return Math.random();
   	}
   	console.profile('timer1');
   	console.log('loop: ', loop());
   	console.profileEnd('timer1');
   </script>
   

6. 现在，我们将在 Firefox 中加载我们的 HTML 文件，并通过按 F12 并选择控制台模块来打开 Firebug。

7. 可能我们需要启用控制台。如果是这样，我们必须通过按 F5 重新加载我们的网站。

8. 最后，我们查看控制台输出，看到我们的分析代码块使用了 533 毫秒和 101 次函数调用。

发生了什么？

我们将函数调用包装在console.profile()和console.profileEnd()函数中。在执行过程中，控制台记录profile()和profileEnd()函数之间的每个函数调用，并生成一个完整的分析表，你可以看到哪些函数在何时被调用，以及它们花费了多长时间。

小贴士

手动启动分析

你也可以手动启动分析过程。如果你查看控制台模块中的顶部按钮，你会找到一个名为Profile的按钮。如果你第一次按下它，它将启动一个分析过程，就像console.profile()函数一样。如果你第二次按下它，分析过程将停止，你将在控制台输出中获得分析结果。

尝试英雄 - 详细检查网站

现在的任务是选择一个网站并在 Firefox 中打开它。打开 Firebug 并详细检查这个网站。查看 HTML 和 CSS 代码的结构。还要仔细查看单个 CSS 类如何覆盖其他 CSS 类。

尝试不同的值并自定义它们，以便了解它们的作用。在探索了 HTML 代码结构和 CSS 样式后，查看网站内的 JavaScript 代码。启用分析并检查哪些函数被调用等。

突击测验

Q1. 哪个键盘快捷键可以打开 Firebug？

1. F7

2. F12

3. F13

Q2. 为什么禁用不必要的 Firebug 模块更好？

1. 这确保了良好的性能

2. 没关系

3. 最好启用所有模块

Q3. 当你检查 HTML 文件并悬停在某些 HTML 元素上时，突出显示元素中的黄色和紫色颜色代表什么？

1. 没有黄色或紫色突出显示颜色

2. 这些颜色显示与其他元素的距离

3. 黄色突出显示显示元素的边距，紫色突出显示显示元素的填充

Q4. 你在 Firebug 中更改后，何时可以看到更改？

1. 重新加载页面后

2. 更改立即可见

3. 保存你的更改后

Q5. 你为什么将console.time()和console.timeEnd()函数以及console.profile()和console.profileEnd()函数的第一个参数和唯一标识符设置为？

1. 如果你多次启动或分析进程，Firebug 需要它们来识别在何时停止哪个进程

2. 它只是一个标签，不是必需的

3. 这些函数中没有参数

摘要

在阅读本章后，你应该能够使用 Firebug 检查网站和 Web 应用程序。此外，你应该详细了解如何编辑 HTML 元素，更改它们的 CSS 属性，以及检查 JavaScript 代码。

现在我们想要向前迈进，在下一章中我们将探讨如何与 JavaScript 库协同工作以及如何将它们集成到我们的项目中。

第七章。使用 JavaScript 库

在开发一个网络应用程序时，几乎每个开发者都会使用他们自己的或另一个公共 JavaScript 框架或库，因为没有人愿意一遍又一遍地编写所有必需的脚本代码。没有必要重新发明轮子！

另一个优点当然是，像 Dojo Toolkit、jQuery 或 ExtJS 这样的流行 JavaScript 框架已经在浏览器中得到了验证，这使得它们的使用更具吸引力。

因此，我们希望能够轻松地集成其他开发者的库或使用我们自己的现有库。

在本章中，我们将介绍包含 JavaScript 库的要求：

• 使用 jQuery

• 使用 Dojo Toolkit

• 使用 ExtJS

包含 JavaScript 库的要求

为了使 Aptana Studio 能够与 JavaScript 库一起工作，必须满足一些要求，以便该库可以向 Aptana Studio 内容辅助提供信息。

您想要集成的库必须具有以下之一：

• 一个 JSCA 1.0 规范文件。您可以在 wiki.appcelerator.org/display/tis/JSCA+1.0+Specification 上了解更多信息。

• 脚本注释也可以使用 ScriptDoc 规范进行读取，正如我们在前一章中已经描述的。

• 一个针对 JavaScript 的 虚拟工作室文档（VSDoc）。

小贴士

使用 Aptana Studio 2.X 代码辅助 XML 文件

您还可以使用一个 Aptana Studio 2.X 代码辅助 XML 文件。在这种情况下，您只需将文件扩展名重命名为 .sdocml。

另一个要求是项目必须具有以下类型之一：

• 网络

• PHP

• Python

• Ruby

• Rails

我们需要这些项目类型中的一个的原因是（如第三章 Chapter 3 中讨论的，使用工作空间和项目），它们中的每一个都能够访问并向项目添加不同的功能。

在 第三章，使用工作空间和项目中，您可以了解如何创建这些类型之一的项目，或者如何更改项目的类型。

使用 jQuery

jQuery 是最受欢迎的 JavaScript 库之一。jQuery 是一个免费且非常广泛的库，它提供了许多方便的函数用于 DOM 操作和导航。

正如其名所示，它最初是一个 JavaScript 查询库，如今提供了大量的插件甚至一个完整的 UI 包。

您可以从 jQuery 网站下载它，链接为 docs.jquery.com/Downloading_jQuery。

在我们开始集成 jQuery 之前，我们还可以安装额外的 jQuery 包。这不会花费很长时间，并且只需要安装一次。安装后，内容辅助将为我们提供额外的有用 jQuery 片段和命令。

行动时间 - 安装 jQuery 包

要安装 jQuery 包，请按照以下步骤操作：

1. 在菜单中，导航到命令 | 包开发 | 安装包。

2. 选择jQuery条目并点击确定。

3. 现在，Aptana Studio 从 github 拉取 jQuery 库并将其集成到系统中。

小贴士

克隆 Git 仓库失败？

如果你收到诸如致命：无法查找 github.com的错误，请检查你的 DNS 设置并确保 github 域名正确解析。

发生了什么？

我们已经直接从 Aptana Git 仓库安装了 jQuery 包。Aptana Studio 已自动将其集成到系统中，以便你收到许多进一步的 jQuery 特定内容辅助条目。从现在起，你将在命令菜单中找到一个jQuery条目，其中包含所有片段和一些命令。

现在我们已经安装了 jQuery 包，我们将继续集成 jQuery 库。

行动时间 – 集成 jQuery

在本节中，我们将看到如何集成 jQuery。为此，请参考以下步骤：

1. 创建一个名为Using JavaScript Libraries - jQuery的新 Web 项目。

2. 下载 jQuery 源并将其保存到jquery-release-1.7.2-src。

3. 创建一个名为jquery-vsdoc-*version*（将*version*替换为你的 jQuery 版本），在我们的例子中是jquery-vsdoc-1.7.2的文件夹。

4. 现在，我们必须下载相关的 VSDoc 文件。你可以从appendto.com/community/jquery-vsdoc网站下载此文件。现在只需选择你的版本并点击VSDOC链接，在我们的例子中是jQuery 1.7.2 VSDOC，并将文件保存到jquery-vsdoc-1.7.2目录中。

5. 最后，你必须将 VSDOC 文件拖放到你的项目文件夹中，否则内容辅助将不会为你提供 VSDOC 文件中的信息。

为什么内容辅助不起作用？如果内容辅助没有提供任何 jQuery 函数或其他函数，可能你没有通过拖放将 VSDoc 文件集成到你的项目中。作为一个快速解决方案，你可以将文件拖放到另一个项目中，然后再拖回到当前项目中。

发生了什么？

我们已经将 jQuery VSDoc 文件集成到我们的 Web 项目中。从现在起，内容辅助将为我们提供当前作用域中所有可用的 jQuery 函数。

所以，例如，如果你输入$(d)并将光标放在d变量后面，你可以通过按Ctrl + 空格键来触发内容辅助；内容辅助将随后为你提供一些建议。

你可以将光标放在例如$(document)条目后面，并再次触发内容辅助。现在内容辅助也将为你提供所有可用的 jQuery 函数。

简单，不是吗？不再需要在文档中搜索，因为您不知道哪些函数可用或应该如何编写它们——现在您可以直接浏览所有函数和属性的列表，并选择所需的项。

使用 Dojo Toolkit

Dojo Toolkit 是一个可靠的 JavaScript 工具包，提供了许多自制的组件、插件和小部件。所有这些都具有国际化特性，正如 Dojo 团队所说，它们是无与伦比的。它已经在所有主流浏览器中进行了彻底测试，适用于编写各种应用程序，从大型网络应用程序到移动应用程序。

您可以从 Dojo Toolkit 网站获取它，网址为 dojotoolkit.org/download/。

行动时间 - 集成 Dojo Toolkit

以下步骤展示了如何集成 Dojo Toolkit：

1. 创建一个名为 Using JavaScript Libraries - Dojo 的新网络项目。

2. 下载 Dojo Toolkit 源代码并将其解压到一个文件夹中，例如，dojo-release-1.7.2-src。

3. 将包含 Dojo Toolkit 源代码的文件夹复制到您的 项目 文件夹中。

4. 创建一个名为 dojo-sdocml-*version* 的文件夹（将 *version* 替换为您的 Dojo Toolkit 版本），在我们的例子中是 dojo-sdocml-1.7.2。

   在完成前面的步骤后，您的项目在 项目资源管理器 视图中应该看起来像以下截图：

   

5. 为了在 Aptana Studio 中使用 Dojo Toolkit，我们必须为其创建一个 SDOCML 文件，因为它的文档不是在 ScriptDoc 中创建的。

6. 如果您想使用 Dojo Toolkit 的 1.6.0 版本，可以从 raw.github.com/aptana/dojo.ruble/master/support/dojo.1.6.0.sdocml 下载，1.7.0 版本可以从 github.com/gigi81/studio3-sdk/blob/master/tools/frameworks/dojo/1.7/api.sdocml 下载。

7. 如果您想使用其他版本，可能需要自己创建。但不必害怕，这非常简单。如果您打算使用 Dojo Toolkit 的 SDOCML 文件之一，请跳到步骤 10。

8. 第一步是下载当前的 API 文件。API 文件包含 Dojo Toolkit 所有包和函数的完整列表，超过 7 MB，有超过 213,000 行。您可以在 Dojo Toolkit 网站上找到此文件，网址为 download.dojotoolkit.org/release-*version*/api.xml。只需将 *version* 替换为您的 Dojo Toolkit 版本。在我们的例子中，我们使用的是当前版本，即 1.7.2；因此，我们从 download.dojotoolkit.org/release-1.7.2/api.xml 下载以下文件，并将其保存到 dojo-sdocml-1.7.2 目录中。

9. 我们需要将 API 文件转换为所需的 SDOCML 文件。因为 API 文件是一个简单的 XML 文件，我们可以使用 XSL 转换来完成这个任务。你可以在此处下载用于转换的 XSL 文件：raw.github.com/aptana/studio3-sdk/master/tools/frameworks/dojo/1.6/update_dojo_metadata_1.6.xsl。这个 XSL 文件是为 Dojo Toolkit 的 1.6.0 版本创建的，但它也适用于更新的版本。只需将其保存到与 API 文件相同的目录（dojo-sdocml-1.7.2 目录）中。要使用 XSL 文件将 API 文件转换为所需的 SDOCML 文件，你需要 xsltproc 包。如果你还没有安装，可以使用 apt-get 简单地安装它：

   sudo apt-get install xsltproc
   

   如果你使用的是 Windows 操作系统，只需导航到 xmlsoft.org/XSLT/downloads.html 网站。在这里，你可以找到一个指向该库 Windows 版本（由 Igor Zlatkovic 提供）的链接。安装完包后，你可以使用以下简单的 shell 操作来创建 SDOCML 文件：

   xsltproc update_dojo_metadata_1.6.xsl api.xml > api.sdocml
   

10. 最后，你只需将下载或创建的 SDOCML 文件拖放到你的项目中的某个位置。我们将此文件拖放到 dojo-sdocml-1.7.2 目录中。

    经过所有这些步骤后，你的项目可能看起来像这样：

    

发生了什么？

我们已经将 Dojo Toolkit 源代码集成到我们的一个项目中。此外，我们创建了一个 Dojo Toolkit SDOCML 文件，它提供了必要的信息以便内容辅助功能能够提供当前作用域内所有可用的功能。

让我们进行一个简单的检查。在我们的 Dojo 项目中创建一个 JavaScript 文件。打开文件，输入 dojo，然后通过按 Ctrl + 空格键触发内容辅助。内容辅助将为你建议 dojo 对象以及其他以相同字母开头的选项。在右侧列中，你可以看到内容辅助从哪个文件获取了此对象的信息。

现在，让我们继续输入 dojo。内容辅助将列出 dojo 对象的所有可用方法。当我们进一步指定输入，例如 dojo.q 时，内容辅助会更新其列表并删除所有不再匹配的条目。

这次，方法所属的对象显示在右侧列中。列表右侧有一个工具提示，显示该方法的文档。

使用 ExtJS

ExtJS 是一个 JavaScript 框架，就像 Dojo Toolkit 一样，它提供了许多丰富、现代的 UI 小部件。ExtJS 是从 Yahoo 用户界面（YUI）库中收集的功能扩展集合，随着时间的推移，它变得越来越受欢迎。通过不断增加的复杂性和受欢迎程度，它发展成为一个独立的库，称为 ExtJS。

你可以从 Sencha 网站获取它 [在 http://www.sencha.com/products/extjs/download/](http://at http://www.sencha.com/products/extjs/download/)。

执行时间 – 集成 ExtJS

集成 ExtJS 需要以下步骤：

1. 创建一个名为 Using JavaScript Libraries - ExtJS 的新网络项目。

2. 下载 ExtJS 软件包。在我们的例子中，我们将选择 ext-4.1.0-gpl.zip 软件包。

3. 将 ExtJS 软件包提取到你的 项目 文件夹中。

4. 创建一个名为 extjs-sdocml-4.1.0（将 *version* 替换为你的 ExtJS 版本），在我们的例子中为 extjs-sdocml-4.1.0 的文件夹。

   在完成前面的步骤后，你的项目应该看起来像下面的截图：

   

5. 通过在“项目资源管理器”文件夹中右键单击项目名称并点击刷新来刷新你的项目。现在，Aptana Studio 将索引新文件并读取内容辅助所需的信息。这可能需要一点时间，因为 ExtJS 有很多文件。

6. 现在我们必须获取所需的 ScriptDoc 文件。如果你想使用 ExtJS 的 3.3.0 版本，你可以在 raw.github.com/aptana/sencha.ruble/master/support/ext-js-3.3.0.sdocml 找到该文件。如果你想使用 4.0 或 4.1 版本（如我们的示例所示），你可以从网络博客 www.thekuroko.com/aptana-sdocml-code-hinting-support/ 下载 ScriptDoc 文件。John Crosby 开发了一个工具，该工具使用 Adobe AIR 和 jsduck 创建必要的 ScriptDoc 文件。到目前为止，我们可以感谢 John 的工作。我们下载所需的文件并将其拖入 sdocml 目录。

刚才发生了什么？

我们已经将 ExtJS 集成到我们自己的项目中。这和 jQuery 以及 Dojo Toolkit 的集成方式相同。再次强调，非常重要的一点是将文件拖入项目中，否则内容辅助功能将不会提供 ScriptDoc 文件中的任何信息。

你将能够以类似于我们在 jQuery 和 Dojo Toolkit 案例中测试的方式测试它。

尝试一下英雄般的操作 – 将 JavaScript 库集成到你的当前项目中

现在你的任务是选择你当前使用我们在本章中处理过的库之一的项目。看看这个库是如何目前集成的，并调整其集成方式，以便你可以在进一步开发中使用内容辅助。

完成后，尝试使用代码补全，看看是否提供了所有库功能。

快速问答

Q1. 为了使用内容辅助与 JavaScript 库一起使用，必须满足哪些要求？

1. 库 API 必须以 XML 或 JSON 格式可用

2. 无，内容辅助直接从您的源代码文件中读取

3. 库必须在 ScriptDoc 格式、虚拟工作室文档（VSDoc）或具有 JSCA 1.0 规范文件中进行文档记录。

Q2. 你可以使用 Aptana Studio 2.X 代码辅助 XML 文件与 Aptana Studio 3 一起使用吗？

1. 是的，只需将 XML 文件扩展名重命名为 SDOCML 文件扩展名

2. 不，在 Aptana Studio 3 中无法使用它们

3. 是的，但必须使用 XSLT 转换

Q3. 为了使内容辅助与您的库一起工作，绝对必要的是什么？

1. 必须将 ScriptDoc 文件复制并粘贴到您的项目中

2. 必须将 ScriptDoc 文件拖入您的项目

3. 没有内容

Q4. jQuery 包提供了什么？

1. 完整的 jQuery 内容辅助信息，以启用所有内容辅助功能

2. 只有 jQuery 片段和一些命令

3. jQuery 本身——不再需要 jQuery 库的单独副本

摘要

在阅读本章之后，您应该能够将几个 JavaScript 库集成到您的项目中，以便内容辅助提供所有必要的信息，使您的工作更加高效。此外，您应该详细了解除了本章中已经讨论的 JavaScript 库之外，还需要哪些内容才能进行集成。

在下一章中，我们将学习如何使用 FTP 在远程服务器上工作。

第八章.远程使用 FTP

许多网站和 Web 应用程序都位于远程 Web 服务器上，可能在某个计算机中心或类似平台上的遥远地方。这有时会有些问题，因为在远程服务器上开发网站或 Web 应用程序时，您必须手动上传每个更改的文件。在这种情况下，工作流程非常长，对代码进行一些更改，切换到第三方 FTP 软件，试图记住您刚刚编辑了哪些文件，选择它们，然后最终上传它们可能会非常令人烦恼。当这些文件上传后，您将能够测试您开发项目中更改的结果。因此，您网站或 Web 应用程序的每个小更改都需要许多步骤。

但是，使用 Aptana Studio 在远程 Web 服务器上开发项目有一个更简单的方法。Aptana Studio 允许您以远程方式处理项目。这比使用第三方 FTP 软件要简单得多。您不需要记住您更改了哪些文件，您只需更改文件并保存即可，这就足够了！Aptana Studio 会意识到您已更改文件，并使用同步功能上传您的更改。所有这些都会自动完成。

让我们试试吧！

在本章中，我们将介绍：

• 使用远程视图创建、修改和删除 FTP 连接

• 使用 Web 部署向导

• 使用连接管理器窗口创建、修改和删除连接

• 导出和导入 FTP 设置

远程视图

我们首先需要查看的是远程视图。远程视图用于管理 FTP 连接，因此提供了所有当前可用的 FTP 连接的完整列表。我们将看到您如何打开此视图，您将能够创建新的 FTP 连接，以及如何修改和删除现有连接。

要打开远程视图，只需导航到窗口 | 显示视图...并选择远程条目。现在，远程视图应该出现在 Aptana Studio 的左侧，与项目资源管理器和应用资源管理器视图一起分组，如以下截图所示：

动手时间 - 创建 FTP 连接

1. 打开远程视图。

2. 点击远程视图右上角的小地球图标。

3. 首先为新的 FTP 连接输入一个名称。理想情况下，选择一个包含 IP 地址或主机名的名称。

4. 然后您必须选择用于连接的协议。只需选择 FTP、SFTP 或 FTPS。在我们的示例中，我们将选择 FTP。

5. 此外，您必须输入连接的宿主、用户名和密码。

6. 在您输入账户数据后，您可以使用测试按钮立即测试输入的访问数据。

7. 此外，如果连接测试成功，你可以选择一个远程目录作为新连接的默认目录。

8. 最后，你可以展开 更多选项 部分，以便进行更详细的设置，例如选择不同的 端口 或 编码 选项，如下截图所示：

9. 通过点击 确定 保存新的 FTP 连接后，新的连接出现在远程视图连接列表中，如下截图所示：

发生了什么？

我们已经通过远程视图创建了一个新的 FTP 连接。现在我们可以在 连接管理器 窗口中使用此 FTP 连接，或者直接从项目中进行连接，以便与远程服务器连接。

操作时间 - 修改 FTP 连接

1. 打开远程视图。

2. 在连接列表中选择你想要修改的 FTP 连接。

3. 右键单击它并选择 属性 选项。

4. 现在，将出现一个窗口，你可以修改连接数据。

5. 最后，通过点击 确定 确认更改。

将出现以下对话框，我们可以编辑我们的连接设置：

发生了什么？

我们已修改现有的 FTP 连接（可能有一个新密码的连接）并确认了新的连接数据。从现在起，该连接使用当前修改后的账户数据。

删除 FTP 连接

FTP 连接可以非常快速地删除。只需打开远程视图，选择你想要删除的连接列表中的 FTP 连接。现在右键单击此条目并选择 删除 选项。

Aptana Studio 会询问你是否确定要删除此连接。如果你确定，只需点击 确定 确认删除。以下截图显示了如何删除一个 FTP 连接：

从现在起，此删除的连接在 Aptana Studio 中不再可用。

由于你现在已经熟悉了使用远程视图管理 FTP 连接，我们将继续探讨如何将这些 FTP 连接与本地项目或本地目录连接起来。为此，我们将使用 Web 部署向导。

使用 Web 部署向导

Web 部署向导 帮助你使用 FTP 连接将本地项目与远程服务器连接起来。让我们看看在接下来的几个步骤中有多简单。

操作时间 - 将项目与远程服务器连接

1. 首先，我们创建一个小的项目，我们想要用于我们的示例。我们像往常一样做，然后你可以在项目资源管理器中选择项目根目录，或者在应用资源管理器中打开它。在这个例子中，我们在应用资源管理器中打开项目。

2. 现在我们必须启动 Web 开发向导。此向导位于 App Explorer（项目资源管理器在此位置也有此符号）顶部的包符号后面。我们可以通过单击包符号并选择运行 Web 开发向导...条目来打开此向导，如下截图所示：

3. 在 Web 开发向导的第一步中，您必须选择一个部署提供程序。因为我们想将我们的项目与 FTP 连接，所以我们选择示例中的FTP/SFTP/FTPS选项，如下截图所示：

4. 之后，您必须输入您的 FTP 连接数据。第一步是为此连接输入一个名称。这个名称应该与网站或 Web 应用程序相关，这样您就可以轻松地识别连接。

5. 协议的选择是一个重要的步骤。根据此选择，后续的字段数量和类型将自动更改。可能的选项是 FTP、SFTP 和 FTPS。只需选择所需的协议。我们想设置一个简单的 FTP 账户，因此我们只选择 FTP。

6. 在此步骤中，我们输入 FTP 连接的服务器主机、用户名和密码。输入这些数据后，您将能够使用 Aptana Studio 的另一个不错功能——一个连接测试按钮。单击此按钮，Aptana Studio 将尝试连接到您刚才指定的 Web 服务器。如果 Aptana Studio 能够连接到 Web 服务器，您将收到一条适当的消息；如果不能，您将收到来自内部 FTP 客户端的错误消息。成功消息如下截图所示：

7. 如果您已输入正确的连接数据并且连接测试成功，您现在将能够选择远程 Web 服务器上的一个目录，该目录用作您源代码的根目录，如下截图所示：

8. 此外，还有一个更多选项部分，您可以调整一些更特殊的行为，例如使用的端口或编码。

9. 此窗口中的最终配置是同步设置。如果您正在创建与项目相关的 FTP 连接，此选项在此阶段可用。在这里，您可以设置同步的行为。一旦您激活了同步，您将看到以下截图中的设置：

   这些同步设置如下截图所示：

   

   小贴士

   为什么同步设置如此重要？

   同步设置非常重要。如果您与不同的开发者一起在同一个远程项目上工作，并且某个开发者更改了您已经作为本地副本下载的文件，怎么办？没问题，您不需要考虑这个问题，Aptana Studio 使用同步功能来识别差异。

10. 通过完成 Web 部署向导，Aptana Studio 会自动启动第一次同步。在这里，您必须最初选择哪些文件应该被同步。下面的截图显示了同步窗口：

    小贴士

    跳过 .project 文件

    在开始同步之前，请从 .project 文件中勾选 跳过 复选框，因为您只需要这个文件在您的本地 Aptana Studio 项目中。

11. 点击 同步 按钮开始同步。完成后，您的远程项目将包含当前源代码，您可以关闭同步窗口。

发生了什么？

我们已经创建了一个 PHP 项目并将其与远程 Web 服务器连接起来。之后，我们相互同步了它。

现在，我们能够在本地项目中处理远程文件。如果您现在修改一个文件然后保存它，Aptana Studio 会自动启动同步并上传修改后的文件。

您还可以手动启动同步，如下面的截图所示：

也快速查看一下 App Explorer 视图中的 发布 菜单。

使用连接管理器

连接管理器 窗口允许您配置本地容器与远程站点或另一个本地容器之间的连接。

远程视图与 连接管理器 窗口之间的区别在于，您在远程视图中仅定义 FTP 连接，而在 连接管理器 窗口中，您管理的是 FTP 连接与一些本地项目或目录的组合。

因此，您可以为 Web 服务器创建单个 FTP 连接，并在许多不同的连接、本地项目或目录中使用它。

操作时间 – 打开连接管理器并创建新的连接

1. 导航到项目资源管理器。

2. 选择一个项目并展开它。

3. 您应该看到项目中的 连接 节点作为最后一个节点，如下面的截图所示：

4. 但如果你没有看到这个连接节点怎么办？没问题，在这种情况下，连接节点只是不可见。为了激活连接节点，点击视图菜单并选择自定义视图...条目。在可用自定义窗口中，您需要切换到内容选项卡并激活如图所示的网站连接复选框：

5. 如果您在项目中看到连接部分，右键单击它并选择如图所示的连接管理器...条目：

6. 现在为了创建一个新的连接，我们在左侧列表下方，底部点击绿色的加号符号（+）。连接管理器窗口在连接列表中创建一个新的条目并自动选择它，这样我们就可以立即输入连接数据。

7. 您必须在视图顶部位于名称文本字段中输入新连接的适当名称。

8. 在下一步中，您必须选择一个本地源。这可能是一个已经存在的 Aptana Studio 项目，或者也可能是您本地驱动器上的目录。您可以使用浏览...按钮来选择它。继续并选择您的源。

9. 最后，您必须选择连接的目标。在这里，您可以选择到一个已经创建的远程服务器的 FTP 连接。您也可以通过点击新...来创建一个新的 FTP 连接，或者直接选择您本地驱动器上的本地项目目录。

发生了什么？

在第一步中，我们只是打开了连接管理器窗口。在某些情况下，连接管理器节点是不可见的，因此我们必须看看我们如何使其可见。无论如何，您必须在屏幕上看到连接管理器节点。

之后，我们在连接管理器窗口中创建了一个新的连接。这意味着我们已将一个本地项目与另一个项目连接起来，该项目可能也位于远程系统上，如图所示：

在连接管理器中修改现有的连接

首先，如果连接管理器窗口尚未打开，请打开它。在连接列表中选择您想要修改的连接。通过选择连接，连接管理器将连接数据填写到右侧表单字段中。现在您可以通过点击应用按钮来更改它们的值并应用更改。

现在，我们已经在连接管理器窗口中选择了现有的连接并修改了连接的值。调整值后，我们通过点击应用按钮保存它们。

在连接管理器中删除现有的连接

首先，如果尚未打开，请打开连接管理器窗口。在连接列表中选择您想要删除的连接。现在点击连接列表末尾的红色符号。之后，Aptana Studio 会询问您是否确定要删除此连接。如果您确定，只需点击确定以完成删除。

现在，我们已经在连接管理器窗口中删除了一个现有的连接。这个连接现在将不再在 Aptana Studio 中可用。

导出和导入 FTP 设置

Aptana Studio 允许您导出创建的连接并在将来再次导入。这是一个非常有用的功能。您可以从连接创建备份并在设置 Aptana Studio 的新安装时恢复它们。但对于拥有大量连接的公司或开发团队来说，这也很有用。他们可以在只有一个 Aptana Studio 安装的情况下创建当前连接，并将它们导出到一个导出文件中。之后，他们将在所有其他 Aptana Studio 安装中轻松导入这些连接。

操作时间 – 导出 FTP 设置

1. 为了导出当前的 FTP 设置，在主菜单中导航到文件 | 导出...。

2. 在窗口中展开“Aptana Studio”条目，选择如图所示的“连接设置”条目，然后点击“下一步”按钮：

3. 选择一个文件以导出您的连接设置。如果您想创建一个新文件，只需选择路径并输入您自己的文件名。

4. 如果您以前已经导出了连接设置，并且想要覆盖旧设置，可以选择不警告覆盖现有文件选项，如图所示的以下对话框中所示：

5. 通过点击“完成”按钮来最终化导出。

发生了什么？

我们已经导出了所有当前现有的连接设置。现在，我们创建的所有连接都保存在一个文件中，并准备好重新导入到另一个或新的 Aptana Studio 安装中。

让我们继续看看如何将导出的数据重新导入到 Aptana Studio 中。

操作时间 – 导入 FTP 设置

1. 为了将导出的连接设置重新导入到 Aptana Studio 中，在主菜单中导航到文件 | 导入...。

2. 在窗口中展开“Studio”条目，选择“连接设置”条目，然后点击“下一步”按钮。

3. 在以下视图中，您可以选择从另一个工作区或文件导入，您可能以前已导出。我们将选择“文件”选项，并点击“浏览...”按钮来选择我们的导出文件，如图所示：

4. 最后，我们通过点击 完成 按钮来最终完成导入过程，其中我们已选择要导入的文件。

刚才发生了什么？

我们已经将导出的连接设置导入到 Aptana Studio 中。现在，所有来自导出文件的连接都应该已经恢复并准备好在 Aptana Studio 中使用。

这很简单，不是吗？

尝试连接远程项目与本地项目

现在的任务是选择一个现有的远程项目，这通常是你在使用第三方 FTP 软件时使用的。为它创建一个新的 Aptana Studio 项目，并选择必要的项目类型。之后，通过配置 FTP 连接或使用 Web 部署向导来将此项目与远程 Web 服务器连接起来。

此外，从你创建的连接中导出，以便你将来在创建新的 Aptana Studio 安装时能够恢复它们。

突击测验

Q1. Aptana Studio 提供哪些连接协议？

1. 只有 FTP。

2. FTP 和 SFTP。

3. FTP、SFTP 和 FTPS。

Q2. 你如何创建一个 FTP 连接，以便自动获得同步选项？

1. 当你创建与项目相关的 FTP 连接时。

2. 当你在远程视图中创建 FTP 连接时。

3. 在这两种创建方式中，你都可以自动获得同步选项。

Q3. 你在哪里可以切换项目资源管理器视图中站点连接节点的可见性？

1. 只需在 窗口 | 首选项 下的 系统偏好设置 选项卡中。

2. 在 项目资源管理器 视图下的 自定义视图... 中。

3. 此节点始终可见，无法使其不可见。

摘要

到本章结束时，你应该能够通过使用 连接管理器 窗口来管理你的 FTP 连接。这意味着你知道如何创建、修改和删除连接。此外，你应该详细了解如何将项目与远程 Web 服务器连接，以及如何配置自动同步。我们还看到了在 Aptana Studio 中 FTP 连接如何与我们的小型项目良好工作；但如果你正在开发大型项目，其中有一个完整的开发团队在协作，那么使用版本控制，如 SVN 或 Git，是一个更好的用例。

在下一章中，我们将学习如何与 SVN 仓库和 Git 仓库一起工作。

第九章. 使用 SVN 和 Git 进行协作工作

协作工作是目前的一个重要话题。现在许多大型项目都是以协作方式进行开发的。但这对开发者来说并不总是容易。当许多开发者共同在大项目上工作时，每个开发者都必须有一个公认的工作区域，并且每个开发者都必须确保他不会干扰其他开发者的工作。

如果没有像 SVN 或 Git 这样的工具，像 jQuery 或 Linux Mint 这样的大型项目将无法实现。所有这些项目的开发者分布在世界各地，他们经常在不同的时区工作，有不同的工作方式，但最终所有部分都合并到一个伟大的 SVN 或 Git 项目中。

因此，SVN 和 Git 对所有开发者来说都是一项巨大的财富，对于大型网络项目的快速进展至关重要。

让我们看看在 Aptana Studio 中使用 SVN 和 Git 是多么简单。

在本章中，我们将涵盖以下主题：

• SVN 视角提供了哪些视图

• 检出 SVN 仓库

• 在项目资源管理器中识别不同状态下的文件

• 更新和提交 SVN 项目

• 如何读取 SVN 历史、比较版本和恢复旧版本

• 克隆 Git 仓库以接收项目

• 使用本地 Git 仓库

• 如何在 Git 仓库中暂存、取消暂存、还原和提交

• 推送和拉取远程 Git 仓库

使用 SVN

首先，我们将查看 SVN 视角。我们已经在 第二章 中检查了如何安装 SVN 插件，基础和如何使用视角和视图。如果您还没有安装，请切换回 第二章 并安装它。

SVN 视角提供了一组视图，帮助我们与 Subversion 服务器一起工作。您可以通过在 Aptana Studio 窗口的右上角使用视角菜单来打开此视角。

与 SVN 相关的重要且最常用的视图，我们将要查看的，包括 SVN 仓库 视图、团队 | 历史 视图和 SVN | 控制台 视图。这些视图被归类为选择进入 SVN 和 团队 文件夹的视图，如下面的截图所示：

SVN 仓库 视图允许您添加新的仓库并管理所有可用的仓库。此外，您还有创建仓库的新标签或分支的选项。这些视图属于 SVN 视图，如下面的截图所示：

历史 视图允许你了解项目及其修订历史的大致情况。这个视图被 SVN 和 Git 项目使用；因此，这个视图被存储在 团队 视图组中。可以通过 窗口 | 显示视图 | 历史 菜单打开 历史 视图。在这里，你可以看到所有带有其注释和数据创建时间的修订。此外，你可以查看文件的所有修订版本，并且还有比较所有修订版本的能力。以下截图显示了 历史 视图：

在 SVN 控制台 视图中，你可以找到由 Aptana Studio 执行的所有 SVN 操作的输出。因此，如果你遇到 SVN 冲突或其他问题，你可以查看这个 控制台 视图的输出，可能会更快地定位到问题。当安装了 SVN 插件时，SVN 控制台 视图会自动集成到 Aptana Studio 控制台中。所以，如果你需要 SVN 控制台 视图，只需从 窗口 | 显示视图 | 控制台 打开常规 控制台 视图。如果 控制台 视图已经打开，只需使用视图菜单选择 控制台 类型，在这种情况下是 SVN 控制台 项。

以下截图显示了 控制台 视图以及如何选择 SVN 控制台：

然而，在我们开始使用 SVN 之前，我们必须添加相关的 SVN 仓库。

执行动作 – 添加 SVN 仓库

1. 通过使用 Aptana Studio 窗口右上角的视角菜单打开 SVN 视角。

2. 现在，你应该能在 Aptana Studio 窗口的左侧看到 SVN 仓库 视图。如果它没有自动打开，可以通过选择导航菜单中的视图来打开它：窗口 | 显示视图 | SVN 仓库。

3. 为了添加新的 SVN 仓库，点击 SVN 仓库 视图顶部的带有加号的小 SVN 图标。

4. 你现在需要在弹出的窗口中输入 Subversion 服务器的地址，例如，svn://219.199.99.99/svn_codeSnippets。

5. 点击 完成 按钮后，Aptana Studio 将尝试连接到 Subversion 服务器，以完成添加新仓库的过程。

6. 如果连接到 Subversion 服务器并且 SVN 仓库受密码保护，你必须输入读取 SVN 数据的访问数据。

7. 如果您目前没有可用的所需访问数据，您可以中止进程，Aptana Studio 将询问您是否想要保留位置。如果您点击 否，新添加的 SVN 仓库将被删除，但如果您点击 是，位置将保持不变。这允许您稍后检索所需的访问数据，输入它们，并开始使用 SVN 仓库。

8. 无论您是保留位置还是输入所需的访问数据，新的 SVN 仓库都将列在 SVN 仓库视图中。

发生了什么？

我们已将一个新的 SVN 仓库添加到 Aptana Studio 中。新的仓库现在列在我们的 SVN 仓库 视图中，我们可以从这里检出，或者创建新的标签或分支。

检出 SVN 仓库

在我们了解了如何将新的 SVN 仓库添加到 Aptana Studio 后，我们还想知道如何检查这个仓库以便与包含的源代码一起工作。

您可以像在 Aptana Studio 中做许多其他事情一样，以不同的方式完成此操作。我们将查看如何直接从 SVN 仓库 视图中完成此操作，因为每次我们将新的仓库添加到 Aptana Studio 中，我们都会想要检查它并使用它作为项目。

操作时间 – 检出 SVN 仓库

1. 打开 SVN 仓库 视图。

2. 扩展您希望检出的 SVN 仓库。我们这样做是因为我们想要从仓库中检出 trunk 目录，而不是 tags 和 branches 目录。

3. 现在，右键单击 trunk 目录并选择 检出... 选项。

4. Aptana Studio 现在将从 Subversion 服务器直接读取 SVN 仓库的属性。当收到所有所需的属性后，以下窗口将出现在您的屏幕上：

5. 首先，我们选择 在工作区中检出为项目 选项，并输入新 SVN 项目的名称。

6. 然后，我们选择我们想要检出的修订版本。这通常是头修订版本。这意味着您想要检出最后提交的版本——称为头修订版本。但您可以从过去检查任何想要的修订版本号。如果是这样，只需取消选择 检出 HEAD 修订版本 复选框，并输入您想要检出的修订版本号。

7. 在最后一部分，我们在 深度 下拉列表中选择 完全递归 选项，取消选择 忽略外部 复选框，但选择 允许未版本化障碍 复选框。

8. 在您选择了这些设置后，点击 下一步 按钮。

9. 最后，你可以选择项目应该创建的位置。通常，这是当前工作区，但有时位置可能不同。也许你已经安装了 Web 服务器，并希望将源代码直接放置在 Web 根目录中，以便在本地机器上直接运行 Web 应用程序。

10. 最后，无论你是否为项目选择不同的位置，你都必须点击完成按钮以最终将“检出”到新项目。

发生了什么？

我们已从SVN 仓库视图检出 SVN 仓库。除此之外，我们还看到了如何将仓库源代码检出到工作区以外的其他位置。最后，你现在应该有一个准备好的 SVN 项目，你可以开始工作了。

文件状态

如果你现在正在修改源代码文件中的某些行，项目资源管理器视图和应用程序资源管理器视图会更改文件的图标，使你看到一个黑色背景上的小白色星号。这意味着自上次提交/更新以来文件已更改。

还有一些其他的小图标，它们提供了有关相关文件和目录的信息。让我们更仔细地看看以下截图所示的标签装饰选项卡：

现在，我们将按之前截图所示的顺序讨论这些符号：

• 小上升箭头表示这个文件或目录是外部文件。

• 小黄色圆柱形符号表示这个文件或目录已经处于版本控制之下。

• 红色X符号表示这个文件或目录被标记为删除。下次你提交更改时，该文件将被删除。

• 小蓝色圆柱形符号表示文件或目录已被切换。这些是除了其本地父目录之外属于不同工作副本的文件或目录。

• 小蓝色加号符号表示这个已经版本化的文件或目录需要添加到仓库中。这些可能是你重命名或移动到不同目录的文件或目录。

• 小角形方块表示这些文件与仓库存在冲突。

• 黑色背景上的小白色星号表示这些文件或目录自上次提交以来已更改。

• 如果文件或目录的图标没有小符号，这意味着该文件被 SVN 仓库忽略。

• 黑色背景上的小白色钩子表示这个文件或目录已被锁定。

• 小红色停止标志表示这个文件或目录是只读的。

• 小黄色圆柱形符号表示这个文件或目录已经处于版本控制之下，并且自上次提交以来没有更改。

• 小问号表示这个新文件或目录目前未处于版本控制之下。

如果你在这份列表中没有找到你的图标，或者你的图标看起来不同，没有问题。只需导航到窗口 | 首选项，然后在树中的团队 | SVN下选择标签装饰条目。在这里，你可以找到所有使用的图标。

提交 SVN 仓库

如果你已经通过一些新功能扩展了你的网络应用程序，你现在可以提交这些更改，以便更改被存储在仓库中，其他开发者也可以更新他们的工作副本并获取新功能。

但你如何简单地提交更改的文件？

与 Git 仓库不同，SVN 允许你从仓库提交树中的更改。通过使用 Git，你只能一次性提交整个仓库的更改。但到目前为止，我们想要提交我们的 SVN 仓库更改，因此只需遵循以下 行动时间 – 更新和提交 SVN 仓库 部分中提到的步骤。

行动时间 – 更新和提交 SVN 仓库

1. 在执行提交之前的第一步是更新你的工作副本。因此，我们将首先这样做，Aptana Studio 从 Subversion 服务器读取所有新修订版本并将它们与你的本地工作副本合并。为了进行此更新，右键单击你的项目根目录，然后选择团队 | 更新到 HEAD。

2. 当你的工作副本是最新的时，导航到应用资源管理器视图或项目资源管理器视图，然后右键单击你想要提交的文件或目录，然后在团队选项中选择提交...条目。

3. 如果你选择了一些目录或整个项目，提交窗口只会列出自上次提交以来发生变化的那些选择中的文件。因此，你可以只选择你想要提交的文件和目录。按照你的需要组合选定的文件和目录，并在窗口顶部输入注释。

   提示

   为什么提交更改时必须输入注释？

   因为，通过提交 SVN 仓库，它会自动保存日期、时间和你的用户名；有了这些数据，修订历史记录会存储有关 谁在何时更改了哪个文件 的信息。除此之外，还有注释部分。注释应该描述所做的更改及其目的。

4. 要完成提交，你只需单击确定按钮，提交过程就会开始。

5. 如前所述，你可以在 SVN 控制台视图中看到所有你的 SVN 进程的输出。在下面的屏幕截图中，你可以看到我们的提交过程的结果：

刚才发生了什么？

我们已经更新了我们的工作副本以提交我们的更改。现在其他开发者也可以更新他们的工作副本，然后可以与你一起工作。

提示

请参考第十一章，优化工作和提高协作，了解如何优化此过程。

再次需要注意的是，建议在每次提交之前执行更新。您可以在单个文件树节点中执行更新。您不必每次都更新整个项目，单个节点也可以提交。

更新 SVN 存储库

此外，类似于 SVN 检出，您还有选项将工作副本更新到 Head 修订版本，也可以更新到特定的修订版本号。为了做到这一点，在项目资源管理器视图中右键单击项目根目录，并选择更新到 Head...选项或团队选项卡下的更新到版本...选项。选择这些条目之一后，Aptana Studio 确定所有新文件和要更新的文件，从存储库下载它们，并将它们与您的本地工作副本合并。

现在，您应该已经拥有了当前项目的所有源代码。但是，您如何识别文件中哪些部分是新的或已更改的？

没问题！Aptana Studio 不仅允许您比较两个不同的本地文件，您还可以比较存储库中不同修订版本的文件。请参考以下操作时间部分了解这是如何工作的：

操作时间 - 使用 SVN 历史和比较文件

1. 首先，我们将查看单个文件的 SVN 历史记录。您也可以在整个目录或项目中这样做；现在我们将对单个文件进行操作，但步骤是相同的。在App 资源管理器或项目资源管理器视图中导航到您的 SVN 项目。

2. 选择您想要检查的文件或目录，右键单击它，并在团队选项卡中选择显示历史记录条目。

3. 在 SVN 历史视图中（如图中所示），顶部列出了所有修订版本，以及所选文件更改和提交的位置。在我们的例子中，文件最初是在修订版本8中提交的，然后在修订版本25和26中进行了更新。此外，您还可以看到修订版本的日期和提交该修订版本的用户名称。最后一列是注释列，其中包含有关提交中更改的更多信息。

   SVN 历史视图底部区域中的列表取决于顶部区域中选择的修订版本，并显示在历史视图当前所选范围内受影响的文件。

4. 如果您在底部列表中双击单个文件，Aptana Studio 将从 Subversion 服务器加载所选修订版本的文件，并在相关编辑器中打开它。在编辑器的头部，您可以看到附加到文件名的打开修订版本的编号，如图中所示：

   文件以只读模式打开，仅因为它是已提交的文件。

5. 现在您已经知道如何从您的 SVN 项目中检查文件的旧版本，但了解文件在不同版本之间哪些部分发生了变化也同样有趣。

   为了此目的，您可以使用 比较... 功能。在底部区域选择您想要比较的文件，右键单击它，然后选择 比较... 选项。

   

6. 如下截图所示，窗口允许您选择您想要比较的两个文件。我们已经通过右键单击它来选择了第一个文件。此文件将自动输入到 比较来源 字段中。比较目标 字段将由 Aptana Studio 自动输入。在这里，Aptana Studio 只倒数一个数字。但在我们的案例中（如前一个截图所示），有一个修订 25。在这种情况下，由于没有修订 25，Aptana Studio 选择修订 8 进行比较，因为它是在修订 25 之后最后检查的一个。

7. 选择您想要比较的两个文件修订后，只需单击 确定 以加载 比较 视图。

   小贴士

   在比较来源和目标字段之间切换

   如果比较修订字段已按相反顺序输入，只需单击 交换来源和目标 按钮，Aptana Studio 将交换这两个字段。

8. Aptana Studio 打开这两个文件修订版本的 比较 视图，您可以检查差异。在我们的案例中（如下面的截图所示），我们比较修订 27 和 26，正如您从文件名顶部的修订号后缀中可以看到，修订 27 在左侧，修订 26 在右侧。

   从左到右，您可以查看所有差异。这里很明显，只有三行注释被插入。您可以看到第 19 行上的水平线，它表示一个差异。它也在第 21 行结束，其中包含差异的行结束。在中间的空间中，在两个文本区域之间有一个灰色列。在这个列中，显示了视觉行，显示了新行被添加的确切行。在左侧的行中，第 19 行到第 21 行通过一行视觉线与第 18 行和第 19 行之间的右侧水平线相连。这表明新行是在第 19 行添加的。

   一个很好的功能是，当您将编辑器向左滚动时，右侧编辑器会自动与左侧编辑器同步滚动。

   

9. 但是，当你想要比较一些文件时，你不必总是通过 SVN 历史视图的长路径。你也可以导航到应用程序资源管理器视图或项目资源管理器视图，选择你想要比较的文件，然后右键单击它。在上下文菜单（如以下截图所示）中，选择与...比较条目，你将得到一个包含最常用比较选项的子菜单。

如果你想要比较两个都不在子版本控制中，甚至可能在不同的项目中，只需在项目资源管理器视图中按住Ctrl键选择这两个文件，然后右键单击其中一个文件，在与...比较选项中选择彼此条目。比较视图的比较将类似于以下截图：

发生了什么？

我们已经看到，通过使用 SVN 历史视图，检查文件在先前版本中哪些部分发生了变化是多么容易。从列出文件的所有可用版本开始，我们还讨论了如何将这些版本相互比较。本节还讨论了比较来自其他项目的不同文件。

动手实践英雄——检出 SVN 仓库并与之工作

现在，你的任务是向 Aptana Studio 仓库视图添加一个 SVN 仓库，并将其直接检出到一个项目中。在你创建了 SVN 项目之后，继续在其中工作。更改一些文件并提交更改。当你提交了一些文件后，查看 SVN 历史视图，看看更改是如何显示的。最后，从 SVN 历史视图中选择一个文件，并将其与主修订版本的文件进行比较。

快速问答——测试你新获得的 SVN 知识

Q1. 在每次提交之前推荐做什么？

1. 检出新的工作副本

2. 执行更新

3. 执行清理操作

Q2. 如何识别项目内文件的状态？

1. 右键单击文件，选择属性条目，然后在打开的窗口中选择子版本控制部分。

2. 文件没有不同的状态。

3. 你可以通过文件图标上的小符号来识别文件的状态。

Q3. 当你在进行项目工作时，注意到所做的更改不是你想要的，并且你想恢复到原始状态，应该怎么做？

1. 删除完整的工作副本并再次检出。

2. 尝试使用Ctrl + Z快捷键撤销所有更改。

3. 选择相关的文件和目录，并在项目资源管理器视图中的上下文菜单中使用它来撤销更改。

Q4. 如何比较来自两个不同项目的两个文件？

1. 您必须选择项目资源管理器视图中的两个文件，右键单击其中一个文件，然后在与...比较选项下选择彼此。

2. 在项目资源管理器视图中选择第一个文件，打开它，并将第二个文件拖放到同一个编辑器中。

3. 您必须选择项目资源管理器视图中的两个文件，并将这些文件拖放到编辑器区域。

使用 Git

就像 SVN 一样，Git 是一个版本控制和源代码管理系统，最初由林纳斯·托瓦兹（Linus Torvalds）开发。SVN 和 Git 之间的区别在于 Git 是一个分布式版本控制系统，而 SVN 是一个集中式版本控制系统。

Aptana Studio 自带对 Git 源代码管理的内置支持。但是，如果您使用的是基于 Linux 的操作系统，您必须手动安装 Git 包。您可以使用以下命令来完成此操作：

apt-get install git

如果您使用的是基于 Windows 的操作系统，您不需要安装任何额外的组件。Aptana Studio 预包装了便携式 Git，因此您可以直接使用 Aptana Studio 使用 Git。

克隆 Git 仓库并使用此克隆创建新项目的方法有多种。在此阶段，我们将查看完成此操作的最快方法。

提示

发生了什么？

与 SVN 流程一样，Git 流程也是在控制台执行的。因此，每次操作后都会有一些输出，只有一个小的区别；Git 使用 Aptana Studio 的系统控制台。

操作时间 - 克隆远程 Git 仓库

1. 导航到应用资源管理器视图或项目资源管理器视图。在视图的背景上右键单击，从上下文菜单中选择导入...选项。

2. 在打开的窗口中（如下面的截图所示），展开Git文件夹。选择将 Git 仓库作为新项目选项，然后单击下一步。

3. 现在我们必须确定我们希望克隆的 Git 仓库的URI。在此示例中，我们将选择具有以下 URI 的Less Css项目github.com/cloudhead/less.js.git

4. 接下来，选择克隆文件应存储的项目目标目录。

5. 最后，您可以通过单击完成按钮来完成此过程。

发生了什么？

我们已经克隆了 Git 仓库，并在同一过程中创建了一个新的 Aptana Studio 项目，其中源代码被复制。现在我们可以扩展此项目。以下截图显示了项目资源管理器视图，您可以在其中找到您的 Git 项目：

有时候，有些文件不应该添加到仓库中。在这种情况下，你可以将这些文件添加到一个类似于 SVN 的忽略列表中。只需选择相关的文件，右键单击它，然后在团队条目下选择添加到 .gitignore条目。如果是第一个被添加到忽略列表的文件，Git 仓库会在与被忽略文件相同的目录中创建一个额外的 .gitignore 文件。

创建 Git 仓库

创建 Git 仓库既快又简单。参考以下行动时间部分，了解如何进行此操作。

行动时间 – 为新或现有项目创建新的本地 Git 仓库

1. 首先，如果你想为新的项目创建本地 Git 仓库，请创建一个项目。

2. 现在，在项目资源管理器视图中导航到你的项目，右键单击它，然后在团队选项卡下选择共享项目...条目。

3. 在随后打开的窗口中，如图所示，你必须选择你想要使用的仓库类型。选择Aptana Git并点击下一步。

4. 配置新的 Git 仓库。Aptana Studio 创建所需的基础设施并将它们保存在 .git 目录中。

   在列表中选择你的项目条目，点击创建...，然后就可以了。Aptana Studio 创建了本地仓库并禁用了创建...按钮，因为项目现在是一个 Git 仓库项目。

   

5. 最后，你可以通过点击完成按钮来关闭窗口。

发生了什么？

我们已经创建了一个新项目（以防项目之前不可用），并将这些项目集成到一个新的 Git 仓库中。现在，让我们在我们的新 Git 仓库中管理我们的源代码版本做一些工作。

行动时间 – 使用新的本地 Git 仓库

1. 导航到应用资源管理器视图，创建一个新文件，例如，创建一个名为 hello.php 的文件，并在其中编写一些 PHP 代码。现在我们的 Git 项目和新文件将看起来像以下截图所示：

2. 文件图标上的小问号告诉你，这个新文件目前还没有处于版本控制之下。为了标记这个文件以供下一次提交，右键单击新文件并选择暂存条目。之后，小问号应该会变成一个绿色的加号。

3. 现在你已经创建了一个新文件，向其中写入了一些代码，并标记了这个文件以供下一次提交。

4. 为了将新文件提交到本地仓库，右键单击文件并选择提交...条目。

5. 提交窗口，类似于前面的截图，包含四个区域。在顶部，您将找到当前选定文件的内容。在左下角，您将找到所有未暂存的文件；这包括您不想提交的所有文件。在右下角，您将找到所有已暂存的文件，也包括您想要提交的文件。最后，在底部中间，您将找到一个用于提交注释的区域。填写一个简短的注释，说明您在更改的文件中做了什么，然后点击Commit。

6. Git 完成提交操作后，右下角的暂存文件区域将被清除。现在您可以通过点击Close按钮关闭窗口。

7. 现在我们已经将第一个文件检入 Git 仓库，我们可以继续在文件中添加一些新行。之后，我们可以保存这些更改并更仔细地查看App Explorer视图（如下面的截图所示）。我们会看到在文件图标和文件名之间有一个*****符号。这表明该文件是“脏的”（这意味着自上次提交以来该文件已更改）。

8. 在扩展了您的 Web 应用并且对结果满意之后，您可能希望提交这些更改。您可以通过类似的方式执行此操作。首先，您必须暂存想要提交的文件，然后点击Commit...按钮。

   在提交窗口的顶部（如下面的截图所示），显示当前选定的提交文件的地方，您现在可以看到自上次提交以来发生了什么变化。

   绿色行表示已添加的行，红色行表示已删除的行。

   存储行号的左侧列已被复制。左侧包含上一个提交文件的行号，右侧包含当前文件版本的新的行号。

   

9. 为了完成提交过程，点击Commit按钮，然后点击Close按钮。

10. 如果您对某些更改想要撤销，没问题。右键单击相关文件并选择Revert...条目。现在，Aptana Studio 将文件恢复到最后提交的状态。

    如果Revert...条目变灰，可能意味着您已经暂存了想要撤销的文件。首先选择Unstage...条目，然后撤销您的更改。

发生了什么？

我们已经与本地 Git 仓库项目进行了操作。简而言之，我们创建了新文件，填充了代码，并将第一个版本提交到 Git 仓库。之后，我们扩展了文件并提交了这些更改。此外，我们还看到了如果你想要撤销所做的更改应该怎么做。

拉取和推送 Git 远程项目

如果你已经完成了对本地克隆项目扩展的工作，或者如果你想将本地克隆与远程克隆合并以获取新扩展，你将到达需要使用推送和拉取功能的地步。

首先，我们需要了解推送和拉取功能的意义是什么？

推送功能将本地 Git 仓库的所有更改发送到远程仓库，并在远程端合并，而拉取功能则是从远程 Git 仓库拉取所有更改，并与本地仓库合并。

行动时间 - 拉取和推送 Git 远程项目

1. 在项目资源管理器视图中，导航到你想要推送的项目。

2. 确保你想要推送的所有文件都已经提交到本地 Git 仓库，否则你可能会收到一切更新的消息。

3. 右键单击项目根目录，在团队选项卡中选择推送...条目。

4. 如果需要远程 Git 仓库的授权，你将看到以下窗口，你可以在此输入用户名和密码：

5. 在推送过程完成后，可以在控制台视图中看到 Git 仓库的日志，如下截图所示：

6. 拉取过程也很简单，可以快速完成。在项目资源管理器视图中，导航到你想要通过拉取远程 Git 仓库进行合并的项目。右键单击它，然后选择团队|拉取...。

7. 在后台，Aptana Studio 加载远程仓库并将其与你的本地仓库合并。

   在此过程完成后，如果没有发生冲突，控制台会显示所有新文件或已更改文件的列表，如下截图所示：

   

发生了什么？

我们已经看到推送和拉取远程 Git 仓库是多么容易。在拉取远程仓库后，远程端的所有新文件和更改文件都会与你本地的仓库合并。而在推送本地仓库时，你将本地扩展与远程仓库合并，以便其他开发者可以拉取这些新功能。

英雄之旅 - 检出 Git 仓库

现在的任务是创建你自己的远程 Git 仓库（可能通过 GitHub 或类似的服务），并在 Aptana Studio 中将其克隆到本地项目中。如果项目已准备就绪，开始在其中工作，创建源代码文件，暂存它们，并在你的工作中提交进度。

快速问答——测试你新获得的 Git 知识

Q1. Git 版本控制和 SVN 版本控制之间的区别是什么？

1. 没有差异。两者都包含相同的逻辑，只是实现方式不同。

2. Git 是一个分布式版本控制系统，而 SVN 是一个集中式版本控制系统。

3. Git 是一个集中式版本控制系统，而 SVN 是一个分布式版本控制系统。

Q2. 你可以用什么方法处理未插入到 Git 仓库中的文件？

1. 简单地将它们从你的项目中删除。

2. 将文件重命名，使文件名以点开头。

3. 将这些文件添加到 .gitignore 文件中。

摘要

到本章结束时，你应该熟悉 SVN 和 Git 仓库。通过使用 SVN 仓库，你应该详细了解如何添加一个新的仓库，以及如何将仓库检出到一个项目中。在添加和检出之后，你应该知道如何与 SVN 项目一起工作。这意味着你必须知道如何提交你的本地更改，更新你的本地工作副本，以及如何使用 SVN 历史记录来辅助你的工作。

在使用 Git 的过程中，你不仅看到了如何克隆远程 Git 仓库并在本地项目中与之工作，还看到了如何创建你自己的本地 Git 仓库。在你的本地 Git 仓库中，我们查看了一下提交过程以及如何暂存、取消暂存和撤销文件。最后，我们查看了一下如何推送和拉取 Git 仓库。

在下一章中，我们将学习如何在 Aptana Studio 中以最佳方式使用 PHP。

第十章。PHP 项目

PHP 是一种用于开发网站和 Web 应用的脚本语言。PHP（代表 Personal Home Page）用于在客户端调用脚本时在服务器端编译源代码，并将结果发送到浏览器。

PHP 用于从小型到大型网站和 Web 应用。大型框架、内容管理系统和网店（如 ZendFramework、Symphony、XT-Commerce、WordPress 等）都是使用 PHP 开发的。尽管 PHP 对于需要通过 Web 服务器发送、接收和持久化数据的 JavaScript AJAX Web 应用也非常有用。

在本章中，您将更深入地了解 PHP 以及如何使用 Aptana Studio 3 轻松开发 PHP。

在本章中，您将涵盖：

• 创建和配置 PHP 项目

• 将现有项目配置为 PHP 项目

• 与外部 PHP 库一起工作并包含它们

• 使用 PHPDoc 记录项目

• 使用和配置 PHP 代码格式化器

创建和配置 PHP 项目

编辑单个 PHP 文件非常简单。如果您必须编辑一个或多个 PHP 文件，只需将文件拖放到 Aptana Studio 3 编辑器中。Aptana Studio 会自动在 PHP 编辑器中打开文件；这提供了语法高亮、代码补全等功能，让您可以立即开始编辑。然而，您只有在将 PHP 文件作为 PHP 本质、Aptana Studio 3 项目编辑时，才能完全了解 Aptana Studio PHP 编辑器的强大功能。

动手实践 – 创建 PHP 项目

可以通过以下几个步骤快速创建 PHP 项目：

1. 从 文件 | 新建（或直接按快捷键 Alt + Shift + N）选择菜单项，然后选择 PHP 项目。

2. 在以下截图所示的打开窗口中，输入项目名称并选择项目源代码应存储的位置：

3. 之后，您必须选择 PHP 项目的兼容性。这意味着您将选择最终用于您的 Web 应用的 PHP 版本。当 Aptana Studio 知道您项目的相关 PHP 版本时，它能够调整语法高亮、代码辅助和错误检测（通过解析 PHP 文件）。例如，如果您选择 PHP 4 作为版本，并且有 PHP 5 代码，您将在代码中看到 PHP 5 内容的错误标记。内容辅助功能将不会对命名空间等起作用，并且您也不会获得类、函数和常量的建议内容辅助功能，因为它们仅在 PHP 5 API 中定义。因此，确定您的 Web 应用的需求，并选择您需要的 PHP 版本。

4. 最后，您必须单击 完成 按钮。

5. 或者，如果你想使用现有的源代码库，你可以导航到项目浏览器视图，并在本地文件系统节点中搜索源代码目录。

6. 如果你已定位到源代码目录，右键单击此目录并选择提升为项目...选项，如下面的截图所示：

7. 你必须使用这种方法选择项目类型，因此选择项目类型选项为PHP-主要。作为二级项目类型，你可以选择Web，例如，但请确保 PHP 条目被标记为主要，如下面的截图所示：

   小贴士

   项目性质

   当你在项目浏览器中查看项目时，你可能会在右上角的一些项目图标上看到一个小的符号，这个符号会显示这些项目的首要性质（或命名类型）。一个蓝色的P表示这是一个 PHP 性质的项目。

8. 使用这两种方法，你最终应该会收到一个 PHP 项目，你将使用它作为本章其余部分的基础。

发生了什么？

你刚刚创建了一个 PHP 性质的项目。该项目为你提供了开发 PHP 网络应用程序的特定功能。这意味着你也有能力选择使用的 PHP 版本，因此调整一些功能，例如语法高亮、代码辅助和错误检测（通过解析 PHP 文件的结果）。

你还看到你可以将你的 PHP 项目的性质与 Web 项目结合起来，这将允许你将 Aptana Studio 项目专门化以满足你的项目需求。

配置 PHP 项目

但当你有一个现有的项目，你想要为 PHP 开发配置时，你应该怎么做？没问题，你可以根据需要配置每个项目。接下来的操作时间部分将向你展示如何调整你的 PHP 项目。

操作时间 – 配置 PHP 项目

对于本节，你将从没有分配性质的项目开始。现在我们将使用以下步骤将此项目配置为 PHP 项目：

1. 导航到项目浏览器视图，右键单击你想要配置的项目，并选择属性选项。

2. 在出现的属性窗口中，你可以配置一些你希望查看的与 PHP 相关的属性。在窗口的左侧，你会找到一个属性页面的列表。你可以在窗口右侧更大的区域中找到每个属性页的内容，如下面的截图所示：

3. 你可以从顶部开始逐页滚动，从构建器页面开始。你将在该页面上找到你的项目的构建器。如果你在这里添加网络项目性质，Studio 统一构建器选项将出现在列表中。对于选定的 PHP 项目性质，PHP 构建器被添加到该列表中，因此你不需要手动选择这些条目。如果你选择或取消选择项目性质，这会自动发生。构建器页面可以在以下屏幕截图中看到：

4. 下一个相关的部分是格式化器页面。在这里，你将了解如何选择一个自定义格式化器。在本章的后面，我们将探讨如何创建你自己的格式化器。在选择你自己的格式化器的第一步中，你必须勾选启用项目特定设置复选框。之后，以下屏幕截图中格式化器页面显示的字段将失去只读状态，然后你将能够选择一个格式化器配置文件：

5. PHP 构建路径页面允许你在你的工作空间中包含来自另一个项目的库，甚至是从外部目录中。你将在这个章节的后面看到如何使用此功能的示例。PHP 构建路径页面可以在以下屏幕截图中看到：

6. PHP 开发部分允许你更改项目的兼容性。只需选择所需的 PHP 版本。这意味着，正如你在前面的操作时间部分所学到的，你需要选择最终将用于你的网络应用程序的 PHP 版本。当 Aptana Studio 知道你的项目的相关 PHP 版本时，它能够调整语法高亮、代码辅助和错误检测（这是解析 PHP 文件的结果）。PHP 开发部分可以在以下屏幕截图中看到：

7. 下一个和最后一个相关的部分是项目性质部分。这个部分允许你更改项目的性质。只需勾选你的项目应支持的性质的复选框。通过选择一个性质并按下设为首选按钮，你可以切换项目的首选性质。由于你打算开发一个网络应用程序，你需要选择PHP作为首选性质，并将Web作为附加性质。项目性质部分可以在以下屏幕截图中看到：

发生了什么？

你选择了一个没有分配项目性质的现有项目，目的是将其配置为 PHP 开发。在这个行动时间部分，你看到了如何选择项目构建器，在哪里可以选择特定于项目的代码格式化程序，以及如何从你的工作空间中包含额外的库或外部目录。除此之外，你还学会了如何更改项目性质或所需的 PHP 版本。

在 PHP 项目中使用 PHPDoc

PHPDoc 是 phpDocumentor 的简称，它是一个用于自动生成项目文档的工具。你可以在其网站上获取有关 phpDocumentor 及其更多信息，www.phpdoc.org/。

PHPDoc 提供了一种结构和固定属性的约定，通过它可以创建文件、类、函数和属性的源代码注释。这些注释中指定的属性有助于以标准化的方式定义源代码文件中的信息（如类型和描述），并针对进一步处理进行了优化。

但为什么 PHPDoc 的使用如此重要？

首先，每个开发者都应该知道，对源代码本身进行文档化非常重要。如果你必须扩展另一个开发者的代码，有时并不容易理解开发者为什么在他的代码中编写了某些部分。但有时也可能发生，你必须扩展你过去编写的自己的代码，而你并不记得为什么你以这种方式做了某些事情。至少在这个时候你知道了，因此将代码进行文档化被认为是良好的实践。

但这还不是全部。如果你总是使用良好格式化和有效的 PHPDoc 样式，你可以从你的代码中获得更多。例如，你可以使用 phpDocumentor 自动创建一个完整的 HTML 文档页面。然而，对我们来说，此刻的重要点是 Aptana Studio 会读取我们的 PHPDoc 注释并将信息输入到内容辅助中。

利用这种能力，你可以在编写代码的同时为所有的类、常量和函数创建自动完成。

使用预定义的 PHPDoc 注释

Aptana Studio 3 附带一些预定义的 PHPDoc 注释，可以从 PHP Bundle 片段中包含。这些可以像我们在本章前面提到的那样使用，借助内容辅助功能。接下来的简短行动时间部分将更详细地介绍这一点。

行动时间 – 使用 PHP Bundle 中的 PHPDoc 注释

1. 从 PHP 性质的项目中打开一个 PHP 文件。

2. 将光标放在你想要编写函数或方法的空行上。

3. 输入字符doc并按Ctrl + 空格键触发内容辅助功能。你应该得到类似于以下截图的结果：

4. 内容辅助功能随后建议所有以doc开头的触发代码片段，您可以从列表中选择所需的代码片段。

5. 您可以选择函数条目，并通过按Enter键插入它。

6. 如前一张截图所示，内容辅助功能插入了一个由 PHPDoc 函数注释引入的完整函数体。代码片段插入后，函数名在边框内显示（如前一张截图所示）。这表明该名称可以直接编辑，只需开始输入您新函数的名称。如果您准备好了，可以使用Tab键跳转到代码片段允许您调整的下一个位置。所以如果这种情况，您可以跳转到每个参数，即注释中的函数描述、返回值、作者姓名，最后进入函数体，逐步进行，在那里您可以立即开始编写函数本身。您最终的代码现在应该类似于以下截图：

7. 保存您的文件后，将光标放在新函数下方几行处，并开始输入函数名。如您所见，内容辅助功能已经索引了该函数，现在为您提供轻松插入它的能力。

8. 您可以从内容辅助功能的建议行中读取大量信息。首先，有一个图标显示建议的类型。类型可以是函数、类、代码片段等。此外，建议所在的位置用方括号表示。在我们的例子中，建议是局部的；这意味着它在同一文件中。在其他情况下，建议包含的文件名将显示在建议的位置。如果建议是 PHP-API 条目，它还会显示它可用的是哪个 PHP 版本。最后一列是为代码片段条目保留的，其中显示触发名称。

发生了什么？

您已插入由 PHP Bundle 代码片段提供的 PHPDoc 符合函数注释。这些代码片段使我们能够快速填写预结构化注释中所需的信息。

Aptana Studio 的 PHP Bundle PHPDoc 注释代码片段

Aptana Studio 的标准 PHP Bundle 为我们提供了一些最常用 PHPDoc 注释的代码片段。然而，正如我们之前提到的，您还可以扩展代码片段并创建一些更专门针对您需求的 PHPDoc 注释。

这里是预定义的 PHPDoc 注释及其触发关键词的完整列表：

触发器	标题
doc_c	类
doc_v	类变量
doc_d	常量定义
doc_f	函数
doc_s	函数签名
doc_h	标题
doc_i	接口

然而，必须指出，在非常动态的 PHP 代码中，内容辅助功能并不总是容易工作。在某些情况下，可能无法确定变量的类型，因此内容辅助功能无法为其提供正确的建议。在这种情况下，您需要支持内容辅助功能，并使用小的 PHPDoc 注释声明类型。在下面的屏幕截图中，您将看到这个例子的一个简要示例：

现在，您可以继续查看如何在 PHP 项目中包含和使用外部库。

使用 PHP 库

大多数大型 PHP 项目都附带活跃的附加外部库。通常，这些库并不位于 PHP 项目本身中。例如，您可以将 ZendFramework 直接放置在您的项目中，但您也可以将其放置在 PHP-API 目录或其他位置。

但是，您可能会想知道，这两个过程之间有什么区别？

如果您的 ZendFramework 位于项目中，该项目的内容辅助功能将自动知道所有 PHPDoc 标记的元素。如果是这种情况，项目构建过程可能会变慢，项目大小会大幅增加。在首次包含 ZendFramework 库之后，Aptana Studio 将索引所有 ZendFramework 文件并评估包含的 PHPDoc。然后，每次 Aptana Studio 触发此项目的构建过程时，它也会检查所有 ZendFramework 文件的最后修改时间戳，以确定需要重新索引的已更改文件。

如果您将 ZendFramework 放置在项目外部，您必须将其作为库集成到项目中。否则，Aptana Studio 将无法为您提供 ZendFramework 的信息内容辅助功能。在这种情况下，Aptana Studio 将在创建 Aptana Studio 库时仅索引所有 ZendFramework 文件。之后，只有在 Aptana Studio 启动时，它才会检查每个文件的最后修改时间戳，以识别需要重新索引的已更改文件。如果您想集成在大多数项目中使用的库，您还有额外的优势，即只需包含一次库。包含后，Aptana Studio 将为每个具有 PHP 特性的项目提供该库。

在这两种情况下，内容辅助功能都会学习库中包含的所有可用类、常量和函数，并使用它们进行检查。

注意

您必须记住，所有希望作为内容辅助功能工作目标的一部分包含的库都必须配备 PHPDoc 注释。

在 Aptana Studio 的内容辅助功能的情况下，PHPDoc 注释被确定并用于在开发时为开发者提供更多信息和可用环境的代码建议。

PHP-API 文件默认支持内容辅助功能。当您已选择 PHP 兼容性版本（通过创建或配置您的项目）时，您已调整内容辅助功能，使其仅建议与 PHP 版本相等的类、函数和文档条目。

例如，如果您使用了 PHP-API 函数，如substr，并且不记得哪个参数号有什么功能。没问题，只需将鼠标光标悬停在 PHP 编辑器中的函数调用上，它就会显示一个包含此函数 PHP 文档的工具提示，如图所示：.

在这里，您将获得所需的所有信息，例如，哪个参数需要什么类型的变量，哪些参数是可选的，等等。

小贴士

信息过多！

如果 PHP 文档太大，无法适应工具提示，只需按F2键即可使工具提示粘性。现在您可以在工具提示内滚动并轻松阅读。

使用外部库的行动时间

现在，您将了解如何将外部库添加到您的 PHP 项目中，以便内容辅助功能知道这些附加库中所有可用的类、常量和函数。

1. 首先，您必须添加一个新的用户库。因此，您需要打开窗口下的首选项，在树中导航到Aptana Studio | 编辑器 | PHP | 库。下面的截图显示了库对话框：

2. 然后，点击新建用户库按钮以打开以下截图所示的创建窗口：

3. 在这里，您需要为您的用户库输入一个名称。您将使用 ZendFramework，因此您需要输入此库的名称，该名称由版本号扩展。

4. 然后，您需要选择至少一个或多个包含您库的目录。当您已选择所有必需的库后，点击确定以完成此步骤，如图所示：

5. 现在，您的新库应该列在库列表中。确保您要在 PHP 项目中使用的所有库的相关复选框默认启用，如图所示：

   小贴士

   添加新的 PHP 库时内部会发生什么

   当你添加一个新的库时，Aptana Studio 将索引所有包含的文件。在索引过程中，它会记住每个文件的时间戳，因此每次启动时都可以检查文件是否已更改。如果在启动过程中检测到已更改的文件，Aptana Studio 将重新索引这些文件。因此，你可以确信你总是从内容辅助功能中获得最新的信息。

6. 最后，点击 应用 然后点击 确定 以完成库的创建，并等待它完成库的索引。进度会在一个对话框中显示，如下面的截图所示：

刚才发生了什么？

你已经将 PHP 库如 ZendFramework 集成到 Aptana Studio 中。在你将库添加到首选项中之后，默认情况下，该库将在所有 PHP 项目中使用。

现在你正在开发 PHP 项目时，内容辅助功能将为你提供来自这个库的可用类、常量和函数。

让我们快速测试一下内容辅助功能。在 PHP 项目中打开一个 PHP 文件，并开始输入字符 Zend，如下面的截图所示：

如你所见，Aptana Studio 识别出你想要创建一个类的实例，因此只为你提供以 Zend 开头的那些类。

或者，如果你记不起你的库函数中可用哪些参数，只需将鼠标光标悬停在函数调用上，就会出现一个包含 PHPDoc 注释的工具提示。如果 PHPDoc 注释质量良好，所有问题都会迅速得到解答。以下截图显示了这样一个例子：

配置项目特定库

现在你已经知道如何为所有 PHP 项目提供库，但以下问题仍然存在；如果你不需要或不想在 PHP 项目中使用库，你应该怎么办？可能发生的情况是，你有一个不使用 ZendFramework 的 PHP 项目。在这种情况下，内容辅助功能提供的有关 ZendFramework 的信息可能会在你寻找真正需要的内容辅助信息时打扰你。

此外，这个项目可能是一个 Flow3 项目，但这是你正在开发的唯一一个 Flow3 项目，因此你不想在每个 PHP 项目中都有 Flow3 的内容辅助信息。这并不是问题，因为你可以覆盖每个项目中的库。

操作时间 – 配置项目特定库

让我们看看使用以下步骤配置项目特定库有多简单：

1. 导航到 项目资源管理器 视图中你想要调整使用的库的 PHP 项目。右键单击它并选择 属性 选项。

2. 在打开窗口中，选择PHP Buildpath部分。在这个部分，您将找到三个选项卡，允许您调整使用的库。

3. 工作区选项卡允许您将已包含在您工作区中另一个项目中的库添加到您的项目中。只需单击添加...按钮，然后在弹出窗口中选择一个 PHP 项目。此选项卡在以下屏幕截图中显示：

   小贴士

   工作区选项卡中的默认选择

   默认情况下，您将在工作区选项卡上的列表中找到 PHP 项目。这也是为什么项目内容辅助功能已经知道它自己的类、常量和函数的原因。

4. 外部目录选项卡允许您添加位于您磁盘上某个外部目录中的库。只需单击添加...按钮，然后从弹出窗口中选择一个目录。此选项卡在以下屏幕截图中显示：

5. 库选项卡允许您覆盖 Aptana Studio 的全局首选项中的设置。首先，您必须选中使用项目特定设置复选框。之后，您可以取消选中在全局首选项中配置的条目，这样内容辅助功能就不再提供关于这些库的信息了。库选项卡在以下屏幕截图中显示：

6. 最后，当您完成自定义项目库后，只需单击应用，然后单击确定，以应用这些更改。

发生了什么？

您已经更改了 PHP 项目的默认库，以便内容辅助功能只提供您在这个项目中真正需要的信息。

使用和配置代码格式化器

每个开发者都知道这个问题，例如，假设您想处理另一个开发者的源代码文件，而这个开发者以不同的、难以阅读的风格格式化了代码。如果代码以您喜欢的风格格式化，那该有多好。

如果是这样，那就没问题，因为 Aptana Studio 3 提供了一个易于使用的源代码格式化器。

行动时间 – 使用和配置 PHP 代码格式化器

以下步骤展示了您如何使用代码格式化器：

1. 首先，在 Aptana Studio 3 编辑器中打开您想要格式化的 PHP 文件。

2. 格式化文件是本节“行动时间”中最简单的一部分。只需在编辑器内的任何位置右键单击，然后选择源 | 格式化。或者，您可以使用快捷键 Ctrl + Shift + F。此选择在以下屏幕截图中显示：

3. 执行此操作后，Aptana Studio 代码格式化工具会将您的 PHP 文件格式转换为与代码格式化工具配置一致。然而，这可能不是您喜欢的格式。如果是这种情况，您可以继续查看如何配置代码格式化工具。

4. 要这样做，请转到窗口 | 首选项，然后在树中选择Aptana Studio | 格式化器。格式化器对话框如图下截图所示：

5. 在右上角，您可以创建格式化器的新的配置文件。如果您还没有配置文件，请点击绿色的加号（+）按钮以创建自己的配置文件。这是推荐的，因为这样您可以切换回默认配置。

6. 为您的新配置文件输入一个名称，并选择从哪个配置文件初始化新配置文件。您需要选择默认配置文件选项，如图下截图所示，因为这是您唯一拥有的：

   小贴士

   使用代码格式化器配置文件

   如果您为不同的开发团队或可能不同的客户工作，可能会发生这些开发团队或客户有不同的格式化约定。配置文件允许您为每个创建一个专门的格式化器配置。关于如何将不同的项目与所需的格式化器配置文件结合的信息已在本章中介绍。

7. 点击确定按钮以创建新配置文件。

8. 您将开始自定义新配置文件，该配置文件将保存您旧的配置文件。从窗口顶部选择您的新配置文件，然后在列表中选择 PHP 条目，通过点击铅笔按钮开始编辑功能。

9. 格式化器编辑窗口分为不同的选项卡，您可以在左侧调整许多设置，并立即在右侧看到预览。第一个选项卡包含新行的选项。在这里，您可以设置格式化器应插入新行的位置。此选项卡如图下截图所示：

10. 在第二个选项卡，缩进，您可以调整源代码的缩进类型。这里您可以选择从常规设置继承制表符策略或覆盖它们。此选项卡如图下截图所示：

11. 第三个选项卡，空白行，允许您调整类和函数中空白行的行为。此选项卡如图下截图所示：

12. 第四个标签页，花括号，包含花括号的行为。在这里，你可以选择不同行中应该出现不同花括号。此标签页如图所示：

13. 空格标签页为你提供了 20 多个选项来自定义空格的行为。这些空间设置被分组在括号、标点符号元素和运算符区域。对于每个这些设置，你都可以选择在出现前后有多少个空格。此标签页如图所示：

14. 第六个标签页，注释，提供了注释行为的设置。在这里，你可以格式化源代码中的注释。此标签页如图所示：

15. 最后一个标签页，开/关标签，自定义开/关标签的行为。@formatter:off和@formatter:on标签可以用作 PHPDoc 函数。因此，使用这些标签，你可以标记一个格式化器不应格式化源代码的部分。如果你想使用这些标签，只需启用功能并使用输入的标签从源代码中启用和禁用格式化器。此标签页如图所示：

16. 最后，你只需通过点击确定按钮来确认更改。

小贴士

导入和导出格式化设置

如果你已经完成了代码格式化器的配置，你可能想要保存这些设置以便将来恢复，或者你可能想要在开发团队中分发这些约定，以便每个开发者都能以相同的风格格式化他的代码。为此，你可以在格式化器配置部分使用导入和导出功能。

刚才发生了什么？

你已经创建了自己的格式化器配置文件，并调整了格式化器以满足你的要求。你还查看了一些丰富的自定义可能性，以确保你能够获得所需的源代码风格，以便更容易阅读。

现在你可以格式化你将要处理的每个文件，无论是你自己的还是其他开发者的。但这还不是全部。正如你可能已经注意到的，你可以将此操作应用于其他编程语言。Aptana Studio 目前允许你格式化 CSS、HTML、JavaScript、JSON、PHP、Ruby/ERB 和 XML 文件。

这很简单，而且非常有用，不是吗？

英雄之旅 - 配置你自己的 PHP 项目

现在的任务是选择你自己的位于磁盘某个位置的 PHP 项目。在项目资源管理器中搜索它，并将其提升为项目。继续配置这个新项目以实现最佳的 PHP 开发。

你应该调整 PHP 版本，包含所需的库，并给你的源代码配备有效的 PHPDoc 注释。

此外，你应该创建自己的代码格式化配置文件，这有助于你格式化源代码。将其保存在你的配置文件中，不要覆盖现有的配置文件。创建后，格式化一个格式不同的 PHP 文件，看看结果。

突击测验

Q1. 为什么项目性质对于一个 PHP 项目来说如此重要？

1. 项目性质为具有特定专长的项目添加了额外的功能。

2. 性质对于项目来说并不重要。

3. 性质是每个位于项目中的文件应使用哪种编辑器的提醒。

Q2. 代码格式化工具可以与哪些语言一起工作？

1. 代码格式化工具仅与 PHP 文件一起工作。

2. 代码格式化工具与所有基于 XML 的文件一起工作，例如 HTML 和 XML。

3. 代码格式化工具目前与 CSS、HTML、JavaScript、JSON、PHP、Ruby/ERB 和 XML 一起工作。

Q3. 当你有一个不应该由代码格式化工具格式化的源代码部分时，你会做什么？

1. 在格式化之前剪切该部分，格式化后再粘贴回来。

2. 你必须将部分包裹在 PHP 注释中。

3. 你必须使用 @formatter:on 和 @formatter:off 这两个关键字。

Q4. 为了使用内容辅助功能使用用户库，必须满足哪些标准？

1. 类、常量和函数必须配备 JavaDoc 注释。

2. 类、常量和函数必须配备 PHPDoc 注释。

3. 类、常量和函数需要命名清晰。

Q5. 为什么内容辅助功能默认提供所有项目自有的类、常量和函数？

1. 在项目属性中，PHP 构建路径部分默认包含项目。

2. 项目不知道其项目自有的类、常量和函数。

3. 项目只知道没有 PHPDoc 注释的项目自有的类、常量和函数。

摘要

到本章结束时，你应该能够在 Aptana Studio 中创建和管理自己的 PHP 项目。除此之外，你还应该知道如何使用所有 PHP 特定功能，以充分利用你的 PHP 项目。

你也看到了如何选择你使用的 PHP 版本，以及如何通过 PHPDoc 注释扩展你的代码，使其对内容辅助功能可读，并且你能够从中创建一些 PHP 文档。你还看到了如何配置代码格式化工具并使用它。此外，你还看到了如何包含外部库，例如 ZendFramework，以便内容辅助功能可以为你提供有关库的信息。

第十一章。优化工作和提高协作

Aptana Studio 可以在更多方面优化您在开发团队中的协作工作，这可能会超出您的想象。如您所知，Aptana Studio 不仅仅是一个源代码编辑器。在本章中，我们不仅将探讨如何改进我们自己的工作，还将探讨整个开发团队的有效性。

在本章中，我们将涵盖：

• 自定义语法高亮和共享创建的主题

• 导入和导出设置以与其他开发者共享

• 导入和导出代码格式化配置文件

• 使用书签组织工作

• 使用任务组织工作

• 使用任务视图工作

• 在源代码注释中使用任务

创建语法高亮主题

在本章的第一节中，我们将探讨如何创建我们自己的语法高亮主题。每个人都知道如何使用他们最喜欢的编辑器，因为他们经常使用它，但现在到了切换到 Aptana Studio 并开始使用它的时候了。不幸的是，一开始很难适应 IDE 的新语法高亮，但希望到本章结束时您会发现它很容易。

Aptana Studio 为您提供了一个主题编辑器，您可以在其中调整语法高亮。让我们看看创建自己的语法高亮主题有多简单。

动手时间 - 创建语法高亮主题

1. 导航到窗口 | 首选项，然后在树中转到Aptana Studio | 主题。

2. 在我们开始调整主题之前，我们需要创建自己的主题。因此，我们点击主题窗口顶部的+按钮。

3. 在出现的窗口中，我们需要输入我们主题的名称，如下面的截图所示：

4. 接下来，使用我们之前创建的主题，我们开始自定义新的主题。在主题窗口的顶部，您可以更改前景、背景、光标、选择和行高亮的颜色。只需单击所需的彩色方块即可更改这些颜色。

5. 您可以使用一系列元素来调整前景和背景颜色，以及字体样式。自己尝试一下，更改一些颜色和样式以适应您的偏好。

6. 在字体行中，您可以更改编辑器使用的字体。首先单击选择...按钮，然后选择您喜欢的字体、字体样式和字体大小，如下面的截图所示：

7. 在主题窗口的底部区域，您可以选择在哪些视图和编辑器中使用该主题。只需选择满足您要求的复选框组合即可。

8. 当您完成自定义自己的主题后，点击应用然后确定以完成此过程。

发生了什么？

我们刚刚创建了自己的主题。简而言之，我们已经看到了我们可以创建自己的主题，以及自定义它是多么容易。此外，我们还可以选择我们的主题应该在哪里使用。

分享或恢复您的配置

如您所知，配置 Aptana Studio 可能是一个非常漫长的过程。您可能已经调整了很多设置，但仍有大量设置您可以进行调整。幸运的是，您不必两次都选择所有这些设置，因为 Aptana Studio 提供了许多导入和导出功能。如果您必须重新安装一个新的 Aptana Studio 实例或设置一个新的实例，您可以轻松地导入所有设置，而无需重新配置它们。

这个功能对开发团队来说非常有用，尤其是在项目初期，当项目负责人详细阐述基本配置时。这项任务应该由少数高级或资深开发者来完成，而不是太多（如果团队太大，这个过程可能会不必要地花费很长时间）。制定基本配置的重要点如下：

• 基本配置：我们从基本配置开始。我们已经在第三章中介绍了这个基本配置，使用工作空间和项目。在那里，我们检查了当创建一个新的工作空间时，所有设置都会丢失的行为。然而，当我们设置一个全新的 Aptana Studio 实例时，我们也需要这个功能。如您所记得，我们通过转到文件 | 导入并在树中导航到通用 | 首选项来找到这个导入/导出功能。有关执行导入或导出的更多信息，请参阅第三章中的导入和导出首选项部分，使用工作空间和项目。在许多通用设置中，还有一些设置，例如书签视图配置、键首选项、任务视图配置等。

• 连接设置：连接设置的导出，正如我们在第八章，“使用 FTP 远程工作”中已经学到的，包含了来自连接管理器的所有配置连接。如果开发团队经常与不同服务器的连接进行工作，创建一个包含所有所需连接的导出文件非常有用。导入连接后，用户可能只需更改每个连接的用户名，并输入他们的密码（注意，连接设置导出不会导出密码）。如您所记得，此导入/导出功能可以通过转到文件 | 导入，并在树中导航到Aptana Studio | 连接设置来找到。有关执行导入或导出的更多信息，请参阅第八章，“使用 FTP 远程工作”部分的“导入和导出 FTP 设置”部分。

• 语法高亮：团队应共同努力为最常用的编程语言创建语法高亮配置。这将在团队成员需要从其他团队成员那里寻求帮助时给你带来优势。帮助他人的人能够更快地熟悉其他团队成员的源代码。他们可以迅速识别所有重要的关键词和代码结构。我们已经在本章中介绍了创建和配置语法高亮主题的话题。我们还在“动手实践 - 更改颜色主题”部分中看到了如何在第二章，“基础和如何使用视角和视图”部分的“Aptana Studio 3 自定义”部分中更改主题。接下来几页我们将探讨如何导入和导出主题，但在此之前，我们将完成这个列表。

• 代码格式化：正如之前所述，团队应将所有项目源代码格式化成相同的方式。因此，他们应共同努力配置一个代码格式化配置文件，每个开发者都必须使用。这样做的一个好处是，当开发者需要在其他团队成员的工作站上阅读代码时，他们可以更快地阅读代码，而且当他们在开始工作之前不需要格式化每个文件时，这将节省大量时间和压力。在第十章，“PHP 项目”部分的“使用和配置代码格式化器”部分中，我们已经看到了如何创建一些配置文件。我们将在本章的后面部分看到如何导入和导出这些配置文件。

这些是从 Aptana Studio 导入和导出大量设置的重要要点。导入和导出基本配置和连接设置已在之前的章节中介绍过。然而，导入和导出语法高亮主题和代码格式化配置文件是我们将在下一节中探讨的内容。

如果您已经创建了自己的语法高亮主题，现在您肯定想知道如何导出它并在稍后恢复它。那么，让我们来看看这个。

操作时间 – 导入和导出语法高亮主题

1. 导航到 窗口 | 首选项 并在树中转到 Aptana Studio | 主题。

2. 在您的 主题 窗口的右上角，您将找到 导出 按钮。首先，我们想要导出当前的主题，然后稍后将其导入回来。因此，我们需要选择我们想要导出的主题，然后点击 导出 按钮。

3. 在打开的窗口中，我们将必须选择我们想要保存主题文件的存储位置。只需选择您首选的目录并为主题输入一个名称。此主题文件包含主题信息，以 XML 结构存储，并且必须以 .tmTheme 结尾，如图下所示：

4. 在您选择了文件名和目录后，只需点击 保存 按钮即可完成导出过程。

5. 现在，我们将尝试从我们导出它的位置重新导入配置文件。在这里，我们将从步骤 1 开始的主题设置部分再次开始。

6. 在 主题 页面的右上角，您将在 导出 按钮的左侧找到 导入 按钮——点击它。

7. 打开的窗口允许您从文件系统中选择一个主题文件。导航到您保存导出主题的目录并选择它，如图下所示：

8. 最后，点击 打开 按钮以完成导入过程。

9. 现在创建的主题已在 Aptana Studio 中可用。

发生了什么？

我们刚刚导航到首选项并导出现有的语法高亮主题到我们的本地文件系统。然后我们回到首选项并将主题重新导入到 Aptana Studio。通过这个过程，您可以恢复您的语法高亮主题到其他 Aptana Studio 实例，或者与其他开发者的代码格式化配置文件共享。

在第十章中，PHP 项目，我们看到了如何创建自己的代码格式化配置文件。然而，就像语法高亮主题一样，最好将代码格式化配置文件导出，以创建这些设置的备份或与其他开发者共享。这和导入导出语法高亮主题一样简单。让我们试试！

操作时间 – 导入和导出代码格式化器配置文件

1. 导航到窗口 | 首选项，然后在树结构中进入Aptana Studio | 格式化器，如图所示：

2. 在主题页面的右上角，您将找到导出按钮。在此视图中，导入和导出按钮显示为蓝色图标。最初，我们想要导出当前主题，并可能希望在以后导入它。因此，我们选择要导出的配置文件，然后点击导出按钮。

3. 在出现的窗口中，我们必须选择要保存配置文件的存储位置。只需选择您首选的目录并为配置文件输入一个名称。此配置文件包含格式化信息，以 XML 结构存储，并且必须以.xml扩展名结尾，如图所示：

4. 在选择文件名和目录后，只需点击保存按钮即可完成导出过程。

5. 现在，我们将尝试从导出配置文件的同一路径重新导入配置文件。这里我们从步骤 1 的格式化器设置部分重新开始。

6. 在右上角，您将在导出按钮的左侧找到导入按钮——点击它。

7. 出现的窗口允许您从文件系统中选择配置文件。导航到您刚刚保存导出配置文件的目录，并按以下截图所示选择它：

8. 最后，点击打开按钮以完成导入过程。

9. 现在导入的配置文件已在 Aptana Studio 中可用。

发生了什么？

我们刚刚在首选项中导航，并将现有的代码格式化器配置文件导出到本地文件系统。之后，我们回到首选项并将配置文件重新导入到 Aptana Studio 中。使用此过程，您可以恢复代码格式化器配置文件到其他 Aptana Studio 实例，或与其他开发者共享。

分享 Aptana Studio 首选项

在上一节中，我们看到了如何导出 Aptana Studio 的大量设置和首选项。如果您的团队现在开始开发过程并需要配置每个工作站的 Aptana Studio 工作空间，他们可以通过简单地导入设置来节省大量时间。当新开发者加入您的团队时，他们可以在几分钟内启动并运行一个完全配置的 Aptana Studio 版本，而无需进行无尽的配置。

下面是几个步骤再次说明这个过程：

1. 创建您的第一个 Aptana Studio 实例，并将其完全配置为即将到来的项目的需求。

2. 导出所有设置并与其他团队成员共享。

3. 现在，每个团队成员都在他们的工作站上安装 Aptana Studio 的当前版本，并导入共享的设置。

团队设置、模板以及更多内容可以通过集成源控制，如 SVN 来处理。团队领导只需创建一个新的仓库，并定义可以处理文件和提交的团队成员。这个小圈子现在可以将团队设置和模板基础扩展到其他团队成员，他们只需从 SVN 检出每个新项目约定即可立即使用。使用版本控制的另一个优点是配置和模板使用的开发历史。

分享一个完全配置好的 Aptana Studio 实例的另一种解决方案是复制这个 Aptana Studio 的基本安装。这个过程的缺点是您必须为每个操作系统创建一个基本安装。尽管如此，另一个优点是团队成员已经安装了所需的插件。在安装基本安装的副本后，开发者只需更新 IDE 即可。

小贴士

想法和讨论

如果您对优化 Aptana Studio 有任何想法，或者想要讨论我们检查的一些主题，请访问我们的页面www.coding.ms/aptana-studio-3/。

使用书签

如果您正在处理不同的源代码部分，因此需要频繁地在不同的源代码文件之间跳转，使用书签标记当前使用的源代码区域可以节省大量时间。幸运的是，Aptana Studio 提供了这样的功能。您可以在任何源代码文件的任何一行上放置书签，而无需更改其内容。然后 Aptana Studio 会记住项目中的所有书签。

小贴士

在库中使用书签

如果您使用外部库并且经常需要在其他文件中查找功能，使用书签快速轻松地跳转到所需位置是值得的。唯一的要求是外部库必须在 Aptana Studio 项目中。

行动时间 - 设置书签

1. 在编辑器中打开您想要设置新书签的源代码文件。

2. 在你想要放置书签的行号的左侧边缘右键单击，并选择添加书签...选项，如下截图所示：

3. 在出现的窗口中，你可以输入书签名称。如果你试图在已经包含一些代码的行上设置书签，Aptana Studio 会将此代码预先填充到名称字段中。请注意，你不必使用此预填充的名称，你可以在以下对话框中为你的书签命名任何你想要的名称：

4. 最后，点击确定以完成设置新的书签。

发生了什么？

我们刚刚在文件中的一行设置了新的书签，这行可能是你需要频繁跳转以查看或更改内容的地方。通过以下截图可以看到，你可以通过行号左侧的小蓝色书签标签来轻松识别哪一行有书签：

然而，通过完成这个过程并设置一个书签，这并没有告诉我们如何跳转到它。为了使我们能够做到这一点，Aptana Studio 提供了一个书签视图。让我们看看如何使用这个视图。

书签视图

书签视图是一个包含你当前打开的项目中所有可用书签的列表。你可以通过导航到窗口 | 显示视图 | 书签来打开这个视图。以下截图显示了书签视图：

如果你想要从列表中跳转到书签，只需双击相关的书签，Aptana Studio 就会在编辑器中打开书签文件。然后，它将光标放置在书签所在的行上。

不幸的是，随着时间的推移，你的书签列表可能会变得相当杂乱，你可能需要清理或过滤书签视图。现在我们将看看如何做到这一点。在下一个操作时间部分，我们将给自己一个任务，过滤所有可用的 ZendFramework 书签。

操作时间 - 配置书签视图

1. 打开书签视图。

2. 点击视图菜单并选择配置内容...选项。

3. 在你开始创建和使用自己的过滤器之前，你必须取消选择以下截图所示的显示所有项目复选框：

4. 现在，你可以创建一个新的配置。只需点击新建按钮来创建一个新的过滤器。

5. 点击新建按钮后，在左侧列表中会出现一个名为新建配置的新配置条目。我们现在需要配置这个新条目，以便我们可以使用它。以下截图显示了这些操作：

6. 我们现在将使用比“新配置”更描述性的名称重命名此条目。为此，只需点击 重命名 按钮，然后输入一个名称，例如，ZendFramework。下面的对话框，如以下屏幕截图所示，可以用于重命名：

7. 接下来，我们可以选择过滤器将工作的范围。在这个简单的例子中，我们将范围保留在任何元素上。

8. 最后，我们可以输入一些应该或不应该包含在书签名称中的文本。对于这个例子，输入 ZF 作为 ZendFramework 的简称，并在文本选择框中选择 包含。

9. 最后，我们可以通过点击 确定 来完成配置。

刚才发生了什么？

我们刚刚为书签视图创建了一个过滤器。现在，视图 菜单为我们提供了一个名为 显示 的新条目。这个小子菜单包含所有可用的过滤器，并使我们能够快速过滤书签视图。

作为快速测试，我们将创建两个书签。第一个包含关键字 ZF，第二个将包含一些其他关键字。之后，只需稍微玩一下 显示 子菜单中的 ZendFramework 条目。正如你将看到的，列表将显示和隐藏没有 ZF 关键字的条目。这些操作在下面的屏幕截图中显示：

小贴士

收集显示的列表列

如果你无法看到书签中的一些信息，或者如果你有一些不需要的列表列，请使用 视图 菜单中的 配置列… 项来自定义所需的列。

如果你大量使用书签并且已经有很多书签和过滤器，而且你不想每次都更改过滤器——没问题，只需继续在当前书签视图菜单中创建一个额外的书签视图。你可以给你的新书签视图起任何你喜欢的名字，以描述配置的列表。

SVN 提交评论模板

如果你大量使用基于 SVN 的项目，通常情况下，你必须提交你的当前源代码。如前所述，始终建议你为你的提交提供关于你所做的详细评论。因此，当你经常进行类似更改时，为这些评论创建一个模板是个好主意。

许多开发团队也使用 SVN 仓库的 post-commit 钩子，以便以其他方式进一步处理提交的数据。因此，每个团队成员以相同风格和结构编写评论可能是有益的，这样就可以实现自动处理。

为了使这更容易，你可以为你的 SVN 评论创建模板。

动手时间——创建 SVN 提交评论模板

1. 导航到 窗口 | 首选项。

2. 在树中转到团队 | SVN | 评论模板。您将在这里找到所有可用的评论模板的完整列表，如下面的截图所示：

3. 点击列表右侧的新建...按钮，以创建一个新的模板。

4. 在此处，您可以输入您新评论的完整文本，如下面的截图所示：

5. 最后，点击确定按钮以保存您的新评论。

发生了什么？

您刚刚为 SVN 提交过程创建了一个评论模板。如果您现在正在进行 SVN 提交，并且 SVN 插件要求您输入注释，您可以选择您的其中一个评论模板，如下面的截图所示：

选择必要的模板后，您可以调整或扩展模板文本，并完成提交。

与任务一起工作

在开发网络应用程序时，您可能经常需要处理目前不是高优先级或尚未完全编码的部分，并且希望在稍后完成这部分。遗憾的是，随着项目越来越大，您可能会忘记源代码中的这些部分，留下代码中的空白。最好的解决方案是什么，以便您能够记住这些位置？

如果有一个包含待办事项和修复事项等点的自组织待办事项列表，并且条目也可以有不同的优先级，那会多么好。因此，Aptana Studio 为您提供了一个任务视图。此视图帮助您记住所有需要做或修复的位置。在编码项目时，列表中的所有条目都会自动添加。Aptana Studio 默认理解用于标记任务条目的 @TODO 和 @FIXME 标签。

Aptana Studio 通常理解的标签可以在首选项中进行配置。让我们看看这是如何工作的。

动手实践 – 配置任务和管理任务标签

1. 首先导航到窗口 | 首选项，然后转到Aptana Studio | 任务。任务窗口如下面的截图所示：

2. 在此首选项窗口中，我们首先需要决定是否想要使用区分大小写的任务标签，通过窗口底部的区分大小写任务标签复选框。基于这个决定，我们选择区分大小写的任务标签或不选择。通常使用区分大小写的任务标签是一个不错的选择，因为如果您在注释中包含标签名称，注释将被标记为任务。

3. 复选框上方的列表使我们能够了解当前可用的任务标签概览。在左侧，我们看到标签名称本身；在右侧，我们看到每个标签的相关优先级。要编辑条目，选择要更改的条目并点击编辑...按钮。

4. 在编辑窗口中，您可以更改任务的标签名称或优先级。调整任务标签以符合您的要求后，点击确定以保存更改，如图所示：

5. 现在我们可以通过点击新建...按钮来添加一个新的任务标签，以打开创建窗口。这个窗口的结构与编辑窗口相同。您只需要输入新任务标签的名称和所需的优先级，这样就完成了。在这个阶段，您可以创建一个名为OPTIMIZE的任务标签，用于那些功能良好的源代码部分，但它们可能需要在以后进行优化。以下是一个任务创建的示例，如图所示：

6. 现在点击应用，然后点击确定按钮以完成任务的配置。

发生了什么？

我们刚刚配置了 Aptana Studio 用于填充任务列表的任务行为和管理任务标签。我们看到了如何添加新的任务标签，以及如何编辑或删除可用的任务标签。

如果您在一个开发团队中工作，可能需要添加更多标签，但多亏了标签的管理，这并不是问题，您可以创建您需要的任意数量的标签。

现在我们将看到如何使用任务标签。

创建任务

创建任务可以通过两种不同的方式完成。一种方式是在行号上创建任务，另一种方式是在源代码注释中编写任务。在下一节中，我们将探讨如何创建这样的任务以及创建过程之间的区别。

操作时间 – 在行号上创建任务

1. 在编辑器中打开一个 PHP 文件。

2. 在您想要创建任务的行号左侧单击鼠标右键。

3. 选择如图所示的添加任务...选项：

4. 在出现的窗口中，最重要的信息已经填写好了。您只需要输入新任务的描述。尽管如此，您必须确保描述中包含任务标签，以便任务列表能够过滤这些任务。如图所示：

5. 最后，点击确定按钮，这样就完成了。

发生了什么？

我们刚刚使用行号的帮助创建了我们的第一个任务。任务视图应该立即列出它们。除此之外，你还可以通过以下截图中的小任务图标识别带有链接的任务行：

正如我们已经提到的，创建任务还有第二种方法；我们现在就来看看这个方法。

行动时间 – 使用注释创建任务

1. 在编辑器中打开一个 PHP 文件。

2. 查找你想要放置任务的那一行。

3. 现在，开始输入一个符合 PHPDoc 的注释。这个注释应该包含 PHPDoc 属性 @TODO，后面跟着任务描述文本。

4. 保存你的文件后，任务应该出现在任务列表中。

发生了什么？

我们刚刚使用 PHPDoc 注释的帮助创建了一个任务。在保存包含新任务的文件后，任务列表将包括这个新任务。

小贴士

我的任务在哪里？

如果你已经按照这里描述的方式创建了任务，但它们没有出现在任务列表中，请确保你的项目有一个自然类型，否则构建过程将不会读取任务注释。

但是，你可能会想知道，我应该选择哪种方法？好吧，结果是，基于注释的创建任务方法有更多的优势。首先，任务可以与 Git 和 SVN 共享；其次，如果注释符合 PHPDoc，你还可以将这些任务填写到你的 PHPDoc 文档中。创建任务的这种后一种方法可能更适合单个开发者，他们不想在代码中添加他们仍然需要创建的所有内容。

小贴士

开发团队内的任务

当处理大型项目时，如果所有团队成员都标记了他们的任务、错误和优化，这将非常有优势。当所有发生的情况都相应地标记后，项目经理可以很容易地大致了解还有多少问题需要解决，而无需与每个开发者联系。

尝试一下你学到的内容

你的任务现在是要创建一个你喜欢的语法高亮主题。

然后，导出你所有的 Aptana Studio 设置、主题、代码格式化器等等，以便你以后可以恢复它们。在你完成导出数据后，尝试将文件导入回来。

最后，当你尝试了导入和导出功能后，熟悉书签和任务。为此，打开你的一个项目，浏览包含的文件，然后在经常使用的行上放置书签。如果你发现一行不完整或需要优化，就在那行上放置一个任务。

快速问答

Q1. 你可以在哪里导出主题和代码格式化器？

1. Aptana Studio 中的 首选项 窗口。

2. 文件 窗口中的 导出 按钮。

3. 这些设置无法导出。

Q2. 我们学习到的创建任务的两种方法之间有什么区别？

1. 基于注释的任务位于相关文件中，其他任务位于项目内部。

2. 基于注释的任务位于项目内部，其他任务位于相关文件中。

3. 没有区别。

Q3. Aptana Studio 预定义了哪些任务标签？

1. OPTIMIZE 和 TODO。

2. TODO 和 FIXME。

3. FIXME 和 OPTIMIZE。

摘要

到本章结束时，你应该能够创建和管理自己的语法高亮主题。此外，你应该能够导入和导出 Aptana Studio 最重要的设置和配置。你还应该能够通过使用书签和任务来管理和优化你的工作。

然而，Aptana Studio 可以做的不仅仅是我们在这里所涵盖的内容。例如，你可以扩展可用的捆绑包、模板和代码片段，或者根据项目需要创建新的，此外，还有可能在你自己的开发团队中共享它们，就像 Aptana Studio 团队所做的那样。

当你的项目环境达到这种程度时，捆绑包会随着你项目规模的增加而不断学习。将所有常用的代码结构集成到代码片段中，然后创建具有项目基础结构的文件模板，其中已包含所有标题和页脚，扩展捆绑包的菜单功能，以便所有开发者都能通过菜单使用捆绑包功能（编写他们将在编辑器中直接执行的命令），以及更多。

在下一章和最后一章中，我们将探讨当出现错误时我们必须要做什么。

第十二章. 故障排除

有时我们在使用 Aptana Studio 时可能会遇到问题。这些问题通常取决于所使用的操作系统、Aptana Studio 插件或 Aptana Studio 配置。了解如何从 Aptana Studio 中获取所需信息以解决问题很重要。但可能的问题可能非常多样。

因此，我们无法轻松或以相同的方式解决所有这些可能的问题。此外，你可能会在 Aptana Studio 中找到一个全新的问题或错误。因此，我们将查看一些最常见的问题，以及你可以做什么来解决这些问题。我们还将讨论你需要遵循的程序来解决那些你自己无法解决的问题。

因此，在本章中，我们将涵盖以下内容：

• 当问题发生时应该做什么

• 如何配置系统错误级别

• 你在哪里可以找到日志文件内容

• 你可以从哪里获得额外的支持

• 如何报告错误报告

当问题发生时应该做什么

首先，我们将看看你可以在哪里找到一些额外的信息或帮助，以防你有一些问题或需要帮助。

系统帮助

如果你对 Aptana Studio 的主要功能有任何疑问，首先查看帮助内容菜单。你可以通过访问帮助 | 帮助内容来找到它。出现的窗口为你提供左侧的帮助内容树，帮助内容在右侧显示。

• 内容树包含工作台用户指南选项，它提供了关于 Aptana Studio 一般基础功能的帮助主题。这些帮助主题由位于底下的 eclipse 框架提供。另一个重要的条目是工作室用户 指南选项。在这里，你可以找到关于 Aptana Studio 提供的特定功能的帮助。此外，还可能有更多与已安装的系统插件相关的条目。

你有问题吗？

假设你已经到达了一个点，你在 Aptana Studio 中遇到了一些问题。正如你所阅读的，你可以尝试通过写一个论坛帖子或创建一个错误报告来解决这些问题。但是，停止！

在你继续在论坛上发帖或报告错误之前，你应该尝试自己解决问题。

解决你问题的可能过程可能是执行系统更新。也许你的问题是由 Aptana Studio 或集成插件中的错误引起的。在系统更新后，整个 IDE 应该使用最新的源代码工作——也许你的问题与旧版本有关，现在已经被解决了。如何在第一章“入门”中运行系统更新已经讨论过了。

如果问题仍然存在，你应该开始搜索这个问题。看看是否有错误消息？你能用文字描述你的问题吗？将所有这些信息输入你喜欢的搜索引擎。这次搜索肯定会给你一些解决问题的提示。

如果你的问题仍然存在，搜索也没有给出有效的结果，尝试向你的搜索提供来自 Aptana Studio 的版本和系统信息。我们现在将看看如何从 Aptana Studio 中获取这些信息。

你安装了哪个版本的 Aptana Studio

为了使你的问题搜索更加精确，向你的搜索提供你的 Aptana Studio 版本和其他与你的问题相关的详细信息。

执行操作 – 显示安装详情

在接下来的几个步骤中，你将看到如何检索有关你的安装的大量信息：

1. 导航到帮助 | 关于 Aptana Studio 3。

2. 结果窗口没有提供太多信息。它将简单地为你提供使用的版本/构建号以及一些关于 Aptana Studio 的一般信息。

3. 然而，你可以从这个区域获取更多信息。左下角的小图标按钮为你提供有关你已集成的插件的过滤信息。所以，如果你有一个插件的问题，你需要知道你正在使用哪个版本，导航到这个区域，你将找到你需要的信息。

4. 但这还不是全部，如果你点击安装详情按钮（见前面的截图）。点击它，你将获得 Aptana Studio 安装详情的概览。

5. 在第一个标签页上，你可以找到一个集成在系统中的已安装软件的完整列表。

6. 第二个标签页为你提供安装历史记录。这非常有用！每次你安装新的插件或运行更新时，安装历史记录都会增加一个条目。在上面的区域，你可以找到执行某些活动时的日期和时间。如果你点击这些条目之一，下面出现的列表将显示你当时拥有的安装和插件类型。你还可以在这里选择撤销你之前所做的更改。以下截图显示了安装历史记录标签页：

7. 下一页是功能标签页，为你提供已安装功能的概览。功能标签页显示了所有已安装的插件。

8. 接下来是插件标签页。插件是最小的可安装软件组件。

9. 最后一个标签是 配置 标签。在这个标签中，你可以找到关于 Aptana Studio 整体配置的信息。当你需要报告错误时，这些信息对 Appcelerator 团队非常有用。

运行诊断测试

诊断测试只是提供了对我们调试问题时有用的系统信息的一些片段。目前它没有做更多的事情，但这些信息通常非常有用。

为了运行诊断测试，完成以下步骤：

1. 导航到 帮助 | Aptana | 运行诊断测试...。

2. 就这样！在出现的窗口中，你可以看到关于你的 Aptana Studio 安装的最重要信息。

   我们刚刚创建了诊断测试的输出。

   你的诊断测试结果看起来像以下截图：

   

   在这里，你可以直接将结果复制到剪贴板，以便粘贴到你需要的地方。也许是在论坛或错误报告单上。

查看和清除日志文件

Aptana Studio 有一个日志文件，其中记录了启动和运行 IDE 时的所有警告和错误。有时，如果你遇到 Aptana Studio 的问题，阅读日志文件非常有用。

这将允许你（借助记录的警告和错误）确定问题的来源。

查看和清除日志文件的行动时间

1. 导航到 帮助 | Aptana | 查看日志文件。

2. 就这样！日志文件（它是一个简单的文本文件）在文本编辑器中加载，你现在可以检查它。

3. 如前一个截图所示，从行号列中可以明显看出，这个文件非常大，因为在启动和运行 IDE 时在其中记录了大量的信息。通常，当你搜索日志文件中的问题时，由于信息量很大，可能很难找到与你的问题相关的条目。如果这种情况发生，你应该清除当前的日志文件，再次运行出现问题的部分，然后再次查看日志文件。

4. 清除日志文件就像上一步一样简单。只需导航到 帮助 | Aptana | 清除日志文件，日志文件就会被清除。

发生了什么？

我们刚刚查看了日志文件。日志文件通常非常大，因此阅读相关的信息并不容易。Aptana Studio 3 提供了一个清除日志文件的功能，我们之前也查看过。

如果日志文件不包含你需要的信息，导航到 窗口 | 首选项，然后在 Aptana Studio 下选择 故障排除 项。在这里，你可以选择哪些类型的错误和警告应该记录到日志文件中。

论坛

如果你的问题仍然存在，并且你在互联网上搜索后没有找到解决方案，你的下一步可能是在论坛中发帖。

如果你需要来自 Aptana 社区的帮助，你应该参考以下网站：

aptana.com/support

在这里，你可以找到不同支持方式的概述。在这种情况下，我们想要与其他 Aptana Studio 用户取得联系，以便交换有关你问题的信息。Aptana 有自己的讨论论坛，名为 Tender app，可以在其网站上找到，但团队已决定将论坛迁移到 stackoverflow.com。StackOverflow 拥有一个非常庞大的知识渊博的个人社区，他们通常比 Appcelerator 团队响应得更快。

在 StackOverflow 上，你可以创建一个新的问题，并给它加上 aptana 标签。aptana 标签允许 StackOverflow 通知所有订阅了带有 Aptana 标签的问题的用户，并且还可以将问题分类到其他 Aptana Studio 问题中。

不要忘记在你的帖子中提及你的 Aptana Studio 版本和其他与问题相关的信息。

祝你在与其他 Aptana Studio 用户以及一些 Appcelerator 团队成员的发布和讨论中好运，他们经常在那里提供帮助。

报告错误

当你与问题作斗争，并认为你已经发现了一个可能的错误时，如果是这样，继续向 Appcelerator 团队报告它。在错误被跟踪后，团队将尽快检查并解决这个问题。

在你创建新的错误票据之前，查看当前跟踪的问题是有价值的。也许已经有了一个针对你问题的票据。只需在你的首选浏览器中导航到 jira.appcelerator.org，并使用 问题跟踪器 选项浏览当前问题。

你没有找到你的问题？没有？那么你需要报告一个错误。

行动时间 – 报告错误

让我们看看我们如何报告一个错误。

1. 导航到 帮助 | Aptana | 提交票据... 以打开报告错误的窗口。

2. 在你开始填写你的错误详情之前，我们需要登录到 JIRA 错误跟踪器。如果你没有账户，只需点击注册...，注册表单将在你的默认浏览器中打开。按照要求步骤完成账户注册。

3. 登录到 JIRA 后，你可以填写票据信息。我们从第一个选择开始。类型字段已经正确选中，因为我们想要提交一个可能的错误。然后选择严重性字段，之后你会找到每个选项的简要描述：

   • 阻止器：问题阻止了我们的项目

   • 主要：可能存在解决方案的崩溃或行为不正确问题

   • 轻微：崩溃或行为不正确，但没有合理的解决方案

   • 微不足道：功能正常，但外观/功能需要改进

   • 无：默认

4. 摘要字段就像电子邮件的主题字段一样，保持其内容简短但清晰。

5. 这是最重要的步骤。在重现步骤字段中，你需要非常清楚地描述 Appcelerator 团队必须执行的操作以强制执行故障。在逐步程序中提及这一点——每一点信息都可以帮助解决这个问题。

6. 在实际结果字段中，你必须描述动作的结果。如果描述行为太难，请随意附加一个截图，这将有助于理解问题。

7. 然后，在预期结果字段中，描述你认为在此操作后应该出现的正确行为。

8. 接下来，检查两个要附加的日志复选框。这些信息对 Appcelerator 团队在重现和解决问题时非常有帮助。这些文档中都不包含任何敏感数据。你已经在本章中详细看到了包含的数据。

9. 最后，点击确定按钮以完成报告错误工单的过程。

刚才发生了什么？

我们刚刚导航到错误报告窗口，登录到 JIRA，并开始填写错误工单。在这里，我们必须尽可能清晰地描述问题并将其提交给 JIRA 错误跟踪器。

Appcelerator 团队现在将在错误跟踪器中查找新的工单，阅读它，然后决定如何处理这个工单。

使用你的 JIRA 账户，你可以登录到错误跟踪器并找出你的问题在解决过程中的位置。错误跟踪器可在jira.appcelerator.org/找到。

在这里，你可以识别工单的当前状态并阅读现有解决方案过程的评论。你还可以提供更多信息以支持团队。

如果你已经到了这一步，是时候说：感谢你为使 Aptana Studio 变得更好、更稳定所提供的所有支持！

如果你有一个关于 Aptana Studio 新功能或改进的想法，那太好了！请随意使用工单功能并将想法发送给 Appcelerator 团队。只需选择改进或功能的类型，并尽可能准确地描述你的想法。

备注

注意：请不要用你可以自己解决的问题和问题向 Appcelerator 团队发送垃圾邮件！首先尝试本章中提供的解决方案提示。

修复已移动的工作空间目录

当你与许多不同的工作空间一起工作时，有可能你启动了 Aptana Studio，但你的最后一个使用的工作空间目录已不再可用。这可不是什么好事！如果你没有以每次启动时都询问你想要使用哪个工作空间的方式来配置 Aptana Studio，Aptana Studio 将无法启动，并会显示以下信息：

无法启动产品，因为指定的 workspace 无法创建。指定的 workspace 目录无效或只读。

在接下来的 行动时间 部分，我们将讨论如何解决这个问题。

行动时间——在 config.ini 中更改 workspace 目录

1. 使用您的系统文件浏览器并导航到您的 Aptana Studio 安装目录。

2. 在安装目录中，选择位于配置目录中的 config.ini 文件，并在编辑器中打开它。

3. 查找以 osgi.instance.area.default 开头的行。这一行包含当前使用的 workspace 的路径。

4. 调整路径，以便 Aptana Studio 可以找到有效的 workspace。

5. 最后，保存文件并启动 Aptana Studio。

发生了什么？

您刚刚直接在 config.ini 文件中更改了 workspace 路径。之后，Aptana Studio 将能够找到有效的 workspace。

大胆尝试吧——收集有关 Aptana Studio 的信息

现在您的任务是确定您安装了哪个版本的 Aptana Studio，以及该版本中集成了哪些功能和插件。

在我们了解当前环境之后，我们将查看日志文件并尝试清除它。

最后，尝试运行诊断测试。

突击测验

Q1. 如果您遇到 Aptana Studio 的问题，您应该怎么做？

1. 首先，报告您的问题的 bug。

2. 在您做任何事情之前，尝试重新安装 Aptana Studio。

3. 首先，尝试自己解决问题。在互联网上搜索，如果找不到解决方案，尝试在论坛中寻求帮助。

摘要

到本章结束时，您应该知道当 Aptana Studio 3 发生问题时应该做什么。我们已经看到了解决在 Aptana Studio 中发生的问题的程序，从确定当前可用的环境开始，执行诊断测试，到阅读日志文件。

第十三章：突击测验答案

第一章，入门

突击测验 – 测试你的安装知识

Q1	2
Q2	1
Q3	3

第二章，基础知识以及如何使用视角和视图

突击测验

Q1	3
Q2	2
Q3	1
Q4	2
Q5	1
Q6	3
Q7	1
Q8	1

第三章，使用工作空间和项目

突击测验 – 测试你新学的 Workspace 知识

Q1	1
Q2	2

突击测验 – 测试你新学的 Projects 知识

Q1	3
Q2	2

第四章，调试 JavaScript

突击测验

Q1	3
Q2	2
Q3	2
Q4	3

第五章，代码文档和内容辅助

突击测验

Q1	1
Q2	2
Q3	1
Q4	1
Q5	3

第六章，使用 Firebug 检查代码

突击测验

Q1	2
Q2	1
Q3	3
Q4	2
Q5	2

第七章，使用 JavaScript 库

突击测验

Q1	3
Q2	1
Q3	2
Q4	2

第八章，使用 FTP 远程工作

突击测验

Q1	3
Q2	1
Q3	2

第九章，使用 SVN 和 Git 进行协作工作

突击测验 – 测试你新学的 SVN 知识

Q1	2
Q2	1 和 3
Q3	3
Q4	1

突击测验 – 测试你新学的 Git 知识

Q1	2
Q2	3

第十章，PHP 项目

突击测验

Q1	1
Q2	3
Q3	3
Q4	2
Q5	1

第十一章，优化工作和提高协作

突击测验

Q1	1
Q2	1
Q3	2

第十二章，故障排除

突击测验

Q1	3