読者です 読者をやめる 読者になる 読者になる

フニゲの開発日記

Electronとか...

Cocos2d-JS v3.0を試す

Cocos2d-JS


 まずcocos2d-x.orgからcocos2d-js-v3.0-alpha2.zipをダウンロード。
 解凍して~/cocos2d-jsに置いたとしよう。

 ……いやしかし、その前にantのインストールだな。
 なんとなく毛嫌いしていたのだが、ここは避けて通れないようだ。

 このへんを読むと、「brew update -> brew install antでいけるよ」と書いてあるのだが、brew updateがうまく動かない。最近使ってなかったからか。
 うーんと、対処法はこれですね。 

$ cd /usr/local/Library/Formula/ # brew updateできない時はこんな感じで
$ git reset --hard FETCH_HEAD
HEAD is now at ca8a34d dict 1.12.1

$ brew update
$ brew install ant

 あとXCodeコマンドラインツールも要るらしいので、Appleの開発者用サイトからダウンロードしてインストール。

 あとpython(2.6以上)も当然のように必要になる。

$ cd ~/cocos2d-js
$ ./setup.py

 まずsetup.pyを実行するんだけど、このsetup.pyというのは、要するに~/.bash_profileに環境変数をいろいろ追加するコマンドで、つまりMac標準のbashをシェルに使うことが前提になっている。Windowsの人は……うーん、どうすればいいのかな。大変なのかもしれない。
 setup.pyではAndroidSDKの場所とか聞かれるんだけど、そのへんの設定は後回し。

 プロジェクトの新規作成も、新しい流儀で行きたい。

$ cocos new hogehoge -l js

 cocos2d-xが2の頃はプロジェクトを作る場所が固定(フレームワークの下に作る決まり)なのが不満だったが、3では任意の場所にプロジェクトを作れるようになった。フレームワークのファイルも全部プロジェクトの下にコピーされるので、バージョンがずれて動かなくなる心配も無い。
 そのぶんファイルを全部コピーするのに時間がかかるのだが、まあ待ちましょう。プロジェクトフォルダの内容は、こんな感じになる。

f:id:funige:20140502230536p:plain

 うーん。

 ファイルの名前やディレクトリ構造も大きく変わったが、なんとなく子供の頃の面影は残ってるかな。
 index.htmlはほとんど変わらないし、srcの下にあるapp.jsとresource.jsも大差ない。main.jsはだいぶ整理された。cocos2d.jsは無くなって、project.jsonという設定ファイルの形になっている。
 このままwebサーバーを起動してindex.htmlをブラウザで開けばお馴染みのHelloWorldが見れるのだが、これではちょっとレンタルサーバーで公開してみんなに見てもらおう、というわけにはいかない。ほとんどはiOSとかAndroid用のファイルなんだけど、プロジェクト全体で328MBもある。まだ1行も書いてないのに。

 antを使って、リリース用にコンパイルする(1つの.jsファイルにまとめる)のがCocos2d-JS v3.0のスタイルだ。

$ cd hogehoge
$ cocos compile -p web -m release

 コンパイルしたファイルは、この例だとhogehoge/publish/html5に作成されるので、このフォルダだけアップロードして公開すればいいわけですね。

f:id:funige:20140503203136p:plain

 エレガントです。

広告を非表示にする