周末了,总是忍不住想放飞下自己。于是就试玩了一会大西瓜合成的小游戏,结果愣是停不下来,有点上头啊。
这小游戏很有特点啊,界面第一次打开的时候只有 loading,竟然没有广告,良心了。说白了,这款小游戏就是俄罗斯方块、2048、水果忍者的结合体(可不只是题主说的 2048 的翻版),通过控制水果的下落,两个相同的水果碰撞到一块的时候就会合成更大的水果,同时迸发出溅射的效果。
第一次合成大西瓜的时候界面效果简直亮瞎了我的双眼。不过说句实在话,可能有戏还不太完善,我第一把就卡死了,可能得分太高了吧!
六天前就有朋友在安利这款小游戏,第一次看到的时候我想,这破游戏有什么好玩的,不就是合成个大西瓜嘛,对此不屑一顾。
直到昨天我看到鱼皮老弟分享了一篇《魔改大西瓜》的文章,就忍不住也想自己魔改下,毕竟吃瓜群众玩合成大西瓜,吃瓜程序员当然要玩源码,这才是正确的姿势嘛。
整个代码目录并不复杂,是基于 cocos2d 游戏引擎开发的。
- index.html,游戏的主页面
- project.js,核心代码,游戏逻辑都在这里面
- settings.js,配置文件
- res 目录,存放图片和音频等资源
我以为直接双击 index.html 就可以在本地运行,结果卡在了 99% 的 loading 上。
原因也很简单,双击网页文件的访问协议是 file,而不是 HTTP,导致一些资源无法加载。解决方案是本地搭建一个 Web 服务器,怎么搭呢?
第一步,安装 Node.js,可以通过下面的路径下载安装包。
http://nodejs.cn/download/
安装完成后通过 npm -v
查看是否安装成功。npm 是 Node.js 的模块管理器,功能及其强大。
第二步,安装 Vue CLI,一个基于 Vue.js 进行快速开发的完整系统,提供了一个运行时依赖。文档见一下路径:
https://cli.vuejs.org/zh/guide/
安装完成后通过 vue --version
查看是否安装成功。
第三步,安装 serve 服务,可通过 npm i serve -g
命令进行安装,如果 npm 安装比较慢的话,可以通过 cnpm
来安装。cnpm 是淘宝提供的一个 npm 的镜像,国内访问的速度更快。
如果出现 Error: EACCES: permission denied
表示没有权限,需要在命令前面加上 sudo
,我在《Shell,牛逼》 这篇内容里有解释。
安装完成后通过 serve -v
查看是否安装成功。
第四步,进入到合成大西瓜的源码包下,执行 serve
启动本地 Web 服务。
第五步,在浏览器地址栏键入本地或者网络可以访问的地址就可以启动 Web 服务器了。趁机玩了一把,舒服了。
我也知道,最近娱乐圈八卦多,西瓜多,吃到撑爆,确实给这款小游戏的传播带来了一定的契机。但站在程序员的角度来看,这款游戏好玩才是它火起来的本质,这是我从作者的源码得出来的结论。
如果你恰好也是程序员,想从源码里学点东西,可以点击下面的链接:
好了,祝各位周末愉快,玩得开心!
转载:https://blog.csdn.net/qing_gee/article/details/113454817