cocos2d html5 开发环境
这是我找到的关于 Cocos2d HTML5 开发环境搭建的文章，在此与大家共享。需要说明的是，本文介绍的是在 MacOS 上的搭建过程。
预备知识
学习本教程，你需要熟悉在 MacOS 上安装软件的基本操作。不过不必担心，安装过程其实非常简单，大多时候参考以下操作即可：
- 下载 DMG 文件。
- 双击打开已下载的软件包。
- 将 xxx.app 拖放到
/Application文件夹。
本文将省略每个安装包的具体安装细节。
下载所需的软件包
1. 下载并安装 WebStorm 7
目前，WebStorm 7 最稳定的发布版本是 7.0.2。我们选择 WebStorm 的原因在于它提供了诸多实用特性，如 JavaScript 代码的语法实现、调试、语法高亮以及版本管理等。你可以前往 WebStorm 的官网 获取更多信息。
2. 下载 Cocos2d-html5-v2.2
从 Cocos2d-x 的官网 下载 Cocos2d-html5-v2.2，下载完成后解压到合适的路径。例如，我将其解压到 ~/workspace/Cocos2d-html5 目录下。这里的 ~ 符号代表用户的 home 文件路径，对于我来说就是 /Users/guanghui。
需要注意的是，你也可以从 github 上 Cocos2d-html5 的仓库 中获取 Cocos2d-html5 的最新版本，develop 分支下的开发工作一直在积极进行。
3. 下载并安装 Chrome 30 和 JetBrains-IDE-support
不建议使用 Chrome 的最新测试版，因为 WebGL 的一些 API 发生了改变，在开发过程中你可能会遇到很多因 API 更新带来的问题。尽管当前 Chrome 的稳定发行版本是 31.0.1650.57，但它与 Cocos2d-html5-v2.2 的兼容性不佳。如果因某些原因你不得不使用这个最新版本，可以参考 Google Chrome v31 breaks Cocos2d-html5 获取更多信息。在不久的将来，Cocos2d-html5 团队将会发布一个新版本，届时你的代码将可以在 Chrome 31 上运行。
配置 WebStorm
1. 运行 WebStorm 7
首先，运行 WebStorm 7。如果这是你第一次运行它，系统将提示你选择个人偏好设置，例如选择快捷键。首次运行时，近期项目部分应该是空的。
2. 在 WebStorm 中使用 Cocos2d-html5
从 Cocos2d-html5 中创建一个项目，具体操作如下：
- 选择
Create New Project from Exisiting Files。 - 选择
Source files are in a local directory, no Web server is yet configured，然后点击Next继续。 - 在这一步中，展开目录树指定 Cocos2d-html5 源码的存放路径。指定正确路径后，
Finish按钮可能仍然是灰色的。此时，点击Project Root按钮，Finish按钮将会被激活。
至此，你已经成功在 WebStorm 上配置好 Cocos2d-html5 项目。
3. 使用 Cocos2d-html5
由于你已经在 WebStorm 7 中添加了 Cocos2d-html5 的文件路径，WebStorm 将会解析所有的 Cocos2d-html5 源文件。打开 HelloHTML5World/src/myApp.js，你将能够进行语法实现。
如果你的 Cocos2d-html5 游戏应用中使用了第三方的 JavaScript 库，你同样可以将其添加到 WebStorm 库进行解析，以获取实时的语法提示，具体操作如下：
- 点击
Settings打开项目设置对话框。 - 点击
Add...按钮，指定 JavaScript 库的存放路径。
在 WebStorm 中调试 Cocos2d-html5 JavaScript 代码
1. 通过 JB chrome 扩展将 WebStorm 连接到 Chrome
右击 ~/Github/Cocos2d-html5 下的 index.html，然后选择 Debug 'index.html'。此时将自动打开 Chrome 浏览器。如果你将鼠标放在 JB 插件上，它会显示你已经连接了 WebStorm 7.02。
如果你安装了插件 JetBrains IDE support，这一步将会非常简单。当你点击 WebStorm 里的调试菜单，它将自动连接到 Chrome。你也可以点击 Chrome 工具栏右边的 JB 图标，它将立即跳转到 WebStorm IDE。
2. 在 WebStorm 中调试 JavaScript 代码
- 回到 WebStorm，双击
HelloHTML5World/src/myApp.js查看源代码。 - 设置断点，右击
myApp.js源码视窗左边的工具栏即可设置。 - 开始调试，打开 Chrome 浏览器，点击
HelloHTML5World链接打开示例项目，然后点击 JB 图标返回 WebStorm。程序将会暂停在我们刚刚设置的断点处，编辑器将会转换到调试窗口。 - 现在你可以进行步出、步入、单步执行和继续执行等调试操作。
总结
在本教程中，我为大家展示了配置 Cocos2d-html5 使其与 WebStorm 7 相配合的基础步骤，包括配置语法自动提示和调试。整个过程相对简单。如果你对本教程有任何疑问或建议，请告诉我们，我们真诚地感谢你对此做出的贡献！