我想對於每個Cocos2d遊戲開發者來說，js-tests一直都是學習和參考的寶貴資源，也是最權威的指導教程。而，我們知道，CocosCodeIDE是官方推薦的一款強有力的IDE，其功能之強大，之便捷是其他IDE所無法比擬的。那麼如何將二者組合在一起，爲我們的學習提供幫助呢？本篇博客將帶你走進他們的世界。
一、瞭解CocosCodeIDE和js-tests
CocosCodeIDE：官網推出的一款強大的IDE，基於Eclipse改制而成。其主要特色在於兩個方面:
便捷實用： CocosCodeIDE安裝簡單，配置和創建項目非常容易，運行，調試，發佈項目也非常容易上手。
功能強大： 我認爲CocosCodeIDE最吸引我的地方就是其強大的功能，主要體現在對源碼進行修改後，只需要保存，即可在運行的遊戲中看到修改之後的效果，而不需要重新運行遊戲。這爲經常發生的“微調”操作帶來了極大的便利。
PS：CocosCodeIDE官方下載地址：http://cn.cocos2d-x.org/download/#anchor5
CocosCodeIDE官方教程：http://cn.cocos2d-x.org/article/index?type=code-ide&url=/doc/cocos-docs-master/manual/code-ide/zh.md
js-tests：當你下載好遊戲引擎包時，一般都會自帶兩個案例教程，一個就是大家經常看到的“打飛機”遊戲，另一個就是js-tests。至於它們在哪裏呢？請到你的安裝目錄下的samples文件夾下尋找，如下圖：
js-tests裏面主要展示的是cocos2d API的具體使用方法的案例教程，幾乎每個API都可以找到使用示例，效果非常贊。
二、爲什麼要組合？
在組合之前，我們解釋一下爲什麼要將二者組合。網上的不少教程都推薦大家通過第三方軟件的幫助，如：appserv，wamp，xampp等，來實現在瀏覽器中直接運行js-tests和moonwarriors(打飛機)，並通過瀏覽器中觀看效果，IDE中查看代碼的方式進行學習，可是這樣不僅反覆切換非常麻煩，也不能通過自己的微調來查看效果的改變，當然了，如果要看到改變必須重新運行加載一遍。非常浪費時間，異常繁瑣。
相比之下，我們會發現，在CocosCodeIDE中，我們可以通過win32調試功能，這個非常強大的功能，對我們的js-tests進行實時微調，這對於學習來說，無疑是巨大的幫助。當然了，你也可以通過CocosCodeIDE中的通過瀏覽器運行的功能，在瀏覽器中查看js-tests的運行情況。下面，我們就來一起將CocosCodeIDE和js-tests組合起來吧。
PS：友情提醒，通過win32調試和在瀏覽器中運行得到可測試的功能是稍有差異的，有的功能只能在win32調試狀態下查看，有的則只能在在瀏覽器中運行狀態下查看。
win32運行狀態下無法查看的功能有：
Bake Layer Test
Box2D Test
Facebook SDK Test
Reflection Test
TextInput Test
Touches Test在瀏覽器中運行無法查看的功能有：
Effects Test
Effects Advanced Test
MotionStreak Test
OpenGL Test
Reflection Test
Cocos2d JS Presentation
下圖爲CocosCodeIDE部分截圖，其中最左邊兩個按鈕分別爲win32調試，win32運行，最右邊的按鈕爲在瀏覽器中運行。
三、組合出奇跡
說到組合方法，你可能第一個想法就是，既然CocosCodeIDE是基於Eclipse的，那我直接導入js-tests項目不就完事了嘛。這個，你可以去嘗試一下，反正我是沒成功，貌似js-tests不是一個完整的CocosCodeIDE項目，所以無法導入。如果你成功導入了，請告訴我，不勝感激。如果，你也沒有導入成功，不要着急，跟着我做，只需四步，走向成功。
第一步：在CocosCodeIDE中新建工程
首先在CocosCodeIDE中新建一個Cocos JavaScript工程(我的工程名爲js-tests，這個名字隨便起。)，工程截圖如下：
PS：如果你對配置Cocos Code IDE以及其開發環境還不是很瞭解的話，可以參考我的兩篇博客：
如何快速搭建Cocos2d-JS遊戲開發環境：http://blog.csdn.net/qiumengchen12/article/details/44649331
如何在Cocos2d-JS環境下使用Cocos Studio導出的資源：http://blog.csdn.net/qiumengchen12/article/details/44726787
第二步：刪除無用文件
由於我們創建的工程默認，我們使用了CocosStudio，併爲我們創建了一些CocosStudio需要的文件及文件夾，而我們這裏只是要製作js-tests的CocosCodeIDE運行版本，所以可以將和CocosStudio相關的文件暫時刪除，使得整個項目更加清晰。但是可以保留CocosStudio文件夾，以備以後使用。如下圖，選中的文件均與CocosStudio有關，均可刪除。
第三步：替換相應文件
我們需要替換的文件有：res文件夾，src文件夾，index.html，main.js，project.json。替換文件，即將遊戲引擎安裝目錄的samples/js-tests文件夾下的相應文件，複製粘貼到我們在CocosCodeIDE中創建的項目目錄下，並替換項目目錄下存在的舊文件。最後替換後的項目，如下：
第四步：運行項目
首先，爲了防止資源不同步出錯，你可以刷新一下你在CocosCodeIDE中的項目，然後你就可以愉快地運行你的項目了，無論是win32還是在瀏覽器中運行，你都會收穫成功的喜悅！
win32運行效果截圖：
在瀏覽器中運行效果截圖：
四、最後的支援
幫人幫到底，送佛送到西。如果你懶於進行如上操作，或者操作過程中有不可抗拒因素導致你無法進行，你也可以考慮下載並使用我分享的已經修改好的CocosCodeIDE版的js-tests工程。
我的環境信息如下：
（1） Cocos2d-JS引擎版本：V3.3
（2） Cocos版本：V2.1.5 For Win
（3） Cocos Code IDE版本：V1.2.0 For Win（64bit）
百度網盤分享鏈接：
鏈接：http://pan.baidu.com/s/1o6xFnOu 密碼：nv0s