Cocos2d-html5教程之二 |小一

相信看到这篇文章的时候，大家已经看过对应的demo。搭建好自己的server了。

如果还没搞定的同学，请移步到 Cocos2d-html5 &box2d (一)

我当初到这个时候会有疑问：

1、他的demo都用了哪些文件？他的demo运行的流程是怎样？

2、我如果做自己的demo需要用到哪些文件？如何去配置？

3、怎么去调试啊，用什么编辑器好啊？

ok,相信我遇到的疑惑，大家应该也会碰到吧，一一解答。

1、他的demo都用了哪些文件？他的demo运行的流程是怎样？

就拿小飞机的例子：文件夹名字：MoonWarriors，结构如下

res 就是REsource  里面都是资源文件。

src就是一些游戏源文件和配置文件。外边还有比较重要的两个文件是：main.js和MoonWarriors-html5.js

主要说下：main.js和MoonWarriors-html5.js

在main.js里面你会找到一行代码：

var myApp = new cocos2dApp(SysMenu.scene);

在MoonWarriors-html5.js里

红色圈到的文件，就是要用到的文件。红色边框上边框遮到的

engineDir:'../../../cocos2d/',

这个就是引用的cocos2d路径。如果改变了 cocos2d的路径，记得同步这个位置。

如果写了另外一些场景或者层等其他js文件，请在appFiles里面照格式添加，要注意添加的顺序，要不然会出现未定义的错误，请看platform下的jsloader.js文件，就会明白加载js要注意的问题。

所以demo用到了 cocos2d的文件，在解压目录下：cocos2d  CocosDenshion extensions。

如果想换cocos2d的路径，请记得要copy 3个文件夹。然后修改MoonWarriors-html5.js里面 cocos2d的路径配置。

demo的运行过程：会先根据MoonWarriors-html5.js加载资源、根据配置去预加载一些图片、字体等等（MoonWarriors-html5.js是在index.html引入的）。然后根据man.js

var myApp = new cocos2dApp(SysMenu.scene);

这个参数的去显示第一个场景，SysMenu  对应可以到 src里面找到一个 SysMenu.js文件，他返回的是一个普通的Scene场景

2、我如果做自己的demo需要用到哪些文件？如何去配置？

以MoonWarriors游戏为例

用到游戏里面cocos2d 和CocosDenshion （extensions拓展文件非必须）、index.html、main.js、MoonWarriors-html5.js（可以重命名，重命名后要修改index.html的js导入）res（资源文件夹）、src(源代码文件夹)

新建一个文件夹 Lib ,把cocos2d 和CocosDenshion 、extensionscopy到lib目录下。

然后修改main.js的 cocos2d配置路径，

engineDir:'../../../cocos2d/',

修改为：

engineDir:'lib/cocos2d/',

然后res中没用的资源删掉、src可以留一个 js作为模版参考。然后修改 MoonWarriors-html5.js 的加载js文件的配置。

如下图：

OK，然后可以试着去新建一个场景，然后在main.js设置作为入口。

有一些细节问题：就是Resource.js保留着吧，作为一个规范。反正早晚用到，而且main.js会调用 Resource.js中的变量g_ressources去预加载一些图片什么的。

OK，有问题在交流。

3、怎么去调试啊，用什么编辑器好啊？

调试主要也就是js调试，Chrome 、firefox(安装fireBug)，按F12 进入调试界面

以下是Chrome的调试界面：

cocos2d-html5调试可以用alter、cc.log打印，都可以提示。或者加断点，右键 Add to view.

还是喜欢cc.log()方法，很好使。

至于用什么编译器，感觉没什么顺手的。VS2012 不给力，而且太庞大了，下载麻烦。

其实像大神们说的，记事本都可以，确实。废话少说，推荐一个编辑器，就几M。

sublime_text 2 传送门： 下载

高亮  自动补全  代码提示  格式化 多窗口等等各种无敌功能~ 大家可以试试。

界面如下：

================================

ok  基本讲完了，第二次写这东西，感觉罗哩罗嗦的...

只是希望帮助一些能帮到的人，一起学习  一起探讨  一起进步