CososJS学习笔记（1） 环境配置（填坑版，让你少走弯路！）

概述这段时间比较了国外的phaser、pixi、create等h5游戏框架以及国内的egret、cocosjs之后，最后还是决定使用cocosjs进行h5游戏的开发。 先简单地说一下个人的观点：首先pixi是个轻量级的框架，体积很小，速度也很快（cocosjs的官方说法是速度仅次于pixi，也就是说pixi应该是目前最快的。）但是问题也来了，由于封装得较少，pixi很难较方便地实现复杂逻辑的东西（想要

这段时间比较了国外的phaser、pixi、create等h5游戏框架以及国内的egret、cocosJs之后，最后还是决定使用cocosJs进行h5游戏的开发。

先简单地说一下个人的观点：首先pixi是个轻量级的框架，体积很小，速度也很快（cocosJs的官方说法是速度仅次于pixi，也就是说pixi应该是目前最快的。）但是问题也来了，由于封装得较少，pixi很难较方便地实现复杂逻辑的东西（想要实现任何复杂逻辑理论上都是可以自己写的，甚至整个Js框架都可以自己写，但毕竟我们还要考虑开发效率的问题，所以在框架选择上最好还要考虑这个因素。）而phaser，本人也测试过，在相对高端的手机上运行都是没什么问题的，但是在低端手机上运行效率并不理想。如果不考虑低端手机的话，不得不说phaser确实是一个非常理想的Js游戏框架。它体积不大，API非常齐全，而且功能很强大，例子也很多。个人设计着玩玩的话用这个应该要比cocos好得多了。

phaser的官网：phaser.io

phaser的中文网站：（官方说不是他们做的，所以肯定是国内的大神做的。翻译得很棒很棒！强烈地赞一个！要不是phaser性能较差我直接学phaser就没有cocosJs的事儿了！）phaser.cc

对phaser感兴趣的童鞋可以去这两个网站上面进行学习。phaser的官网有时候需要科学访问，所以有些时间段可能不太稳定。

接下来我们说一下egret，对于白鹭引擎，我只是稍作了解，所以不敢妄做评论。但是typescript的语法结构多少有点奇葩，而且对于并没有接触过action script的程序员来说，想要使用egret还要额外增加学习多一门语言的成本，所以经过一番比较之后，最后决定使用cocosJs进行开发。在低端手机上进行测试，cocos的运行效率应该说是比较理想的（绝对理想是不可能的，毕竟HTML5的运行效率本来就不高，而且还要受制于手机本来就比较差的硬件条件的约束，等等。这里就不再赘述。）

好了，那么接下来就开始说一下关于cocos2d Js的环境配置。不得不说，cocos的官方网站并不友好。为什么这么说呢？对于一个没有任何经验的新手来说，cocos的各种版本显得非常混乱，站在一个新人的角度看问题，我明明只是想开发个游戏啊，为什么要有这么多各种乱七八糟的版本？为什么要装那么多乱七八糟的东西？而且官方首页居然没有对如此简单的问题做一个简简单单的说明或者解释！！简直是让人生气！别跟我扯淡什么cocos是开源免费的，所以很多东西不完善需要慢慢来云云，这些都是放屁。这是一家公司对于市场的态度问题！相比之下unity简直友好得像天使！如果不是unity目前不支持h5开发的话，我也懒得考虑cocos了。如果真的想要花点精力打造一个全自动环境配置和安装的IDe出来，就真有那么难？或者官方录几个视频教一下新人，就真有那么逆天？态度决定一切，在这点上，我对cocos现在的情况保留意见。

好了，说一下安装和配置，本质上讲过程并不复杂，但是这个“不复杂”是针对于熟手的，里面藏了不少坑，我花了不少时间才填了这些坑（极容易出错），很有必要在这里进行一个细致的说明和总结。对于技术大拿来说，这些都是浮云，所以请各路大神勿喷。我有时候甚至觉得，技术屏障是严重阻碍国内的游戏和IT行业真正朝着创造而不是山寨路线迈进的最大制约因素。技术上的门槛和官方的态度极大程度上地影响了真正有创意但却不懂技术的人进入这个行业。

不继续吐槽了，回归正题。我认为，好的教程应该是让人一看就明白的教程。如果教程写出来之后让阅读者云里雾里的，不能怪阅读者的理解能力差，而是写教程的人本身就不负责任或者功力不足。我的想法是，要么不写，要写就要写一份详尽的、真正可以帮到人的文档。这样，才能让别人少走一些不必要的弯路。

步骤1：资源准备（下面以windows7 64位系统的配置为例，本人没使用过mac电脑，所以如果是mac用户只能类比一下了。如果是XP用户的话，建议你重装系统吧……不然后续还是会有很多坑的。）

0.比cocosJs更重要的是先安装Python2.7.6，注意不要安装3的版本。地址：https://www.python.org/download/releases/2.7.6/

（没有这个的话，cocosJs是跑不了的，切记。）

1.cocosJs，这个没什么好说的，去官网下载吧：http://cn.cocos2d-x.org/download#anchor3

下面提到的java、sdk、ndk是和编译成andriod的apk相关的，如果不需要编译apk的话可以跳过这些步骤。

2.然后如果你的电脑上没有安装java jdk 1.7的话，请自己百度找一个。注意需要1.7的版本。

（解释一下，jdk就是java development kit的意思，已经集成了jre的了，不需要再装jre了。这里给出一个我随便百度的下载地址，可能会过期，如果过期的话请自行百度一个：http://www.cr173.com/soft/55503.html 非win7 64位的请自己百度）

（如果已经装了1.8的，那就很麻烦了，先用360或者上网找一个叫做windows installer clean up的软件，来卸载掉电脑里和java相关的东西，然后用360或者其他注册表清理工具清理一下电脑上的注册表。然后用win键+R键打开运行窗口，输入regedit进入注册表，将：HKEY_CURRENT_USER\Software\JavaSoft 和
HKEY_LOCAL_MACHINE\SOFTWARE\JavaSoft 这两个目录下的注册表清理掉，重启，之后就可以安装了。jdk的安装是一个非常蛋疼的问题。如果安装之后还是有问题，呵呵，抱歉，你可能要重装系统了……这个绝对不是忽悠=_=）

关于java的环境配置，百度一下就可以找到很多教程，但是我这里还是要说明一下，首先是下载，不要去官网，下载不到旧版本的，直接百度或者去百度网盘搜索引擎里面找一个就行了。然后是安装，安装位置随你喜欢，但切记路径中不要含有中文。（基本上凡是IT类的东西的安装都要谨记这一点，即使不是绝对必要的，也最好这样，以免日后出现各种错乱让人极度崩溃！下面的配置过程是百度来的，大家直接看就行，不用自己再去百度了。）

安装好后便是配置JDK的环境变量，在桌面上计算机点右键选属性，或是开始菜单计算机上点右键选属性，左边点高级系统设置，点下边的环境变量，

在新d出窗口上，点系统变量区域下面的新建按钮，d出新建窗口，变量名为JAVA_HOME，变量值填JDK安装的最终路径，我这里装的地址是D:\Program files\Java\jdk1.7.0_51，所以填D:\Program files\Java\jdk1.7.0_51，点确定完成，

下面需要设置Path变量，由于系统本身已经存在这个变量，所以无需新建，在原本基本上添加JDK相关的，找到Path变量双击编辑，由于每个值之间用;符号间断，所以先在末尾加上;（注意是英文格式的，不要输其他符号空格等），加上;符号后在末尾加入%JAVA_HOME%\bin，点确定完成，

下面添加CLAsspATH变量，由于不存在，所以新建一个，变量名CLAsspATH，变量值%JAVA_HOME%lib\dt.jar;%JAVA_HOME%\lib\tools.jar，首尾不带空格的，点确定完成，至此环境变量配置完成，点确定关掉环境变量配置窗口。

上面步骤完成后，下面验证下是否配置成功，点开始运行输入cmd打开命令行窗口，输入java -version，显示版本1.7.0_51，输入javac -version，也显示1.7.0_51，说明JDK安装及环境变量配置成功。

请注意：如果重装了之后提示找不到c:\ProgramData\Oracle\Java\javapath\java.exe。的话，请在环境变量的系统变量的path的最前面加入你的java的jdk的绝对路径，以我自己的为例，是：C:\Program files\Java\jdk1.7.0_13;

好了，现在java安装完毕，那么就到安卓的相关东西了。为什么要装这么多乱七八糟的东西？因为你也希望自己做好的东西可以很方便地打包编译成apk文件放到手机里吧？如果不需要的话，那这些步骤全部可以跳过的！没错，全部可以跳过！这些步骤说白了就是让你在电脑上配置andriod开发环境然后可以将cocosJs的工程文件编译成apk而已。至于ios？呵呵，那就复杂了，就算你没有苹果机，也要在电脑上搭载个虚拟机或者干脆装双系统什么的，这个扯得远了，我们这里不说。

下载ndk、sdk、ant这三个东西：http://pan.baidu.com/share/home?uk=1260900318#category/type=0

这是cocos2d Js论坛的大神给出的链接，建议用里面的东西去安装，切记不要使用官网那个只有100多M的sdk tool，除非你想下载完之后自己再更新，但更新又是需要科学访问的，这样的话就又涉及到了别的技术……如果只是个新手的话，建议不要去什么官网下载了！为什么很多人装了之后各种蛋疼呢，因为官网的东西和人家传到百度网盘的东西经常是不一样的啊！

如果哪天这个链接挂了的话，那就只好自己去百度网盘搜索引擎里面找了，直接百度的话也行，要靠自己的甄别能力：

目前官网的ndk版本已经到了ndk-r10d，不要用，还是用ndk-r9d吧。

ant的话无所谓，sdk和ndk到底是用来干什么的这个就不说了，ant是用来编译成h5工程的，所以就算只做h5开发也还是需要这个的。

全部下载完之后建一个文件夹，然后在这个文件夹下面建三个子文件夹，把东西放好，这一步应该就不用多说了吧。直接解压放好就行了。

我存放的位置是C:\sdk\

这里就有一个坑了。请大家注意：cocos的编译是不支持带有空格的路径的。比如说，你的安装路径是C:\program files\，这样的话，在program files文件夹上面有个空格，编译过程寻找路径就会出现"C:\Program"不是内部命令错误。

本人就是遇到了这样的一个巨坑，而且网上还真找不到好的解决方案。所以这一点一定要谨记，希望能让看到这篇东西的新人少走点弯路。这么容易出问题的地方，官方居然不事先说明，哎……我能吐槽么

（http://www.itnose.net/detail/6121615.HTML 这里有一篇做 cocos2dx3.2 android平台搭建开发环境纠错备忘录

的东东，干货，出问题的话请看一下。）

绕过这个坑之后，我们就可以来配置环境了：

添加如下环境变量，这里需要注意的就是，PATH里面变量是添加的不是新建！然后是根据自己的下载的包的版本不同和解压的地址不同，有所差异，但是变量名一定要按照下面的这么写
NDK_ROOT ： C:\sdk\androID-ndk-r9d
ANDROID_SDK_ROOT ： C:\sdk\androID-sdk-windows
ANT_ROOT ： C:\sdk\apache-ant-1.9.4\bin 这里注意了，必须得有bin!!!!!!有的教程里面没有，以后便会出现这个配置失败错误.

随后在PATH里添加
;C:\Python27;%NDK_ROOT%;ANDROID_SDK_ROOT%\tools;%JAVA_HOME%/bin;C:\sdk\apache-ant-1.9.4\bin
关于环境变量java_home那，那就是看你的下载的版本了，可能跟我的不一样，有的教程上写的是 JAVA_HOME ： C:\Program files\Java\jdk1.7.0_51
关于PATH这里我说明一下，需要添加python的地址】

ant那个地方，我是;C:\sdk\apache-ant-1.9.4\bin 而有的教程是;%ANT_ROOT%\bin，直接选用绝对路径(前面一种)的写法比较靠谱。

如果以上配置都没什么问题的话，那么接下来就算是安装完安卓和ant环境了。

接下来是在自己的电脑上安装一个web服务器，建议使用xampp，当然也可以用其他的，这个没有限制。这里以xampp为例：把xampp装好之后，把整个cocosJs解压进去：

C:\xampp\htdocs\cocos2d-Js-v3.5

然后运行xampp的Apache，注意端口不能冲突（如果你的电脑有用IIS的话可能会冲突，出现这个问题的话请自己百度一下，这个比较简单）

然后打开cmd，键入cd 你的项目路径，这里以我自己的为例：

cd表示跳转到指定路径，这个就不用多说了吧？当然不知道也没关系啦，你现在不就知道了嘛，嘻嘻。

关于cocos的一些指令，这里顺便说一下，但是没必要去刻意记住，只要记住一两个常用的就行了：

创建工程
a)首先，你需要打开你的终端工具(windows 系统打开Dos系统)，运行下列命令(自选一种)

b)//创建一个同时包含Cocos2d-HTML5和Cocos2d-x JsB的项目
c)cocos new -l Js

d)//创建一个仅包含Cocos2d-HTML5的项目,--no-native 表示不需要支持Native平台(IOS,AndroID,Mac,windows等)，只支持浏览器就可以了。
e)cocos new -l Js --no-native

f)//创建一个置顶工程名字指定目标的项目
g)cocos new projectname -l Js -d ./Projects

h)例如，我想在桌面创建一个叫HelloWord 的项目。那么有两种做法。

i.第一种：
1.cd ./Desktop
2.cocos new HelloWord –l Js
ii.第二种： cocos new HelloWord -l Js -d ./Desktop

运行项目
浏览器上：
cd ./Desktop/HelloWord
cocos run -p web
编译并运行Cocos2d-x JsB项目在iOS，androID，mac上(即：native平台上)
cd ./Desktop/HelloWord
cocos compile -p ios|androID|mac
cocos run -p ios|androID|mac
例如：我要运行在IOS上，那就运行：cocos run -p ios。编译好之后，对应的工程目录在HelloWord/frameworks/runtime-src/

AndroID项目导入Eclipse：
导入 HelloWord/frameworks/runtime-src/proj.androID 到 Eclipse,这个时候，Eclipse会报错，完成下面一步就好了。

导入 HelloWord/frameworks/Js-bindings/cocos2d-x/cocos/platform/androID/java 到 Eclipse 中即可

打包项目：()
cd ./Desktop/HelloWord
cocos compile –p web| androID|IOS –m release
命令运行成功之后，在HelloWord工程文件夹下多出了一个publish文件夹，这个就是发布包。
例如我想把HelloWord跑在微信上，那三个步骤搞定：
cd ./Desktop/HelloWord
cocos compile –p web –m release
拷贝HelloWord/publish/HTML5到你的服务器下，然后微信浏览器访问这个地址，就搞定了。PC浏览器也是一样一样滴。

最后，强烈建议大家去看刚刚那个链接里面的视频深入学习！以后会继续更新我的学习笔记的！

总结

以上是内存溢出为你收集整理的CososJS学习笔记（1） 环境配置（填坑版，让你少走弯路！）全部内容，希望文章能够帮你解决CososJS学习笔记（1） 环境配置（填坑版，让你少走弯路！）所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。