是时候吐槽一下3.x了,一个小游戏的踩坑之旅

大家好,我是Nowpaper,一个作游戏的一爸,就在上周末,在张晓衡的旁敲侧击下,直播用Creator开发了最近爆款《Like A Giraffe》,而且在他的怂恿下,我首次使用了3.1版本作为开发工具,结果,这一路踩坑着实让我再次坚信,Cocos官方似乎对版本升级这件事,总是带着满满的“恶意”。
155J13W1-32

事实上,我对CocosCreator 3并不陌生,也做过一次3.0的盘点,但是盘点归盘点,真正使用起来却是另外一回事,下面基本上竭尽吐槽之事,这些点可能对于大佬来说根本不值一提,各位看官不必嘲笑我的技术太差,小问题总是阻挠长途的关键点,因为大障碍在开始的时候,我们就已经有了心理准备,恰恰是搁脚的石子才是浪费体力的困难。

《Like A Giraffe》

该游戏已经完成,已经发布到商店: Like A Giraffe | Cocos Store
这款游戏,前后用了将近6个小时,如果换成2.4.x版本的话,估计3个小时内就能完成。

目录

少废话,先上目录

  • Typescript 语法问题
  • cc点,点不出来
  • 莫名其妙的GIT
  • 图像资源Type问题
  • 2D摄像机分组问题
  • 声音事件问题
  • API文档搜索
  • 平台判断的问题

Typescript 语法问题

3.0版本开始全面拥抱Typescript,同时也带来了Typescript的严格定义规范检查,这个可就要死了新手的命,很多人并没有深度使用过TS,即使使用过TS,也不这么深入的看了解严格定义于是就会出现如下:
image
这是什么道理?不能给赋值?这时候就需要改写一下变成严格定义
image
这一般人还不见得知道咋回事,这个问题排除后,下一步:
image
我的天啊,在逗我玩吗?我当然知道它可能为空,还用得着提醒我?这个应对,简直了,你需要进行“as转换”,或者“if判断”,或者使用 “可选链(Optional Chaining)新特性”
image
于是你会发现,原本清洁的代码变得非常多了,我很怀疑发明这个要求的大佬,工作在按代码行数(或字符数)计算工资的公司。
解决它还有一个办法就是:打开tsconfig.json,找到experimentalDecorators设置成为true,这样世界就清净了!不过我也不知道是不是自己的姿势不太对新建项目带的tsconfig.json里"extends": "./temp/tsconfig.cocos.json"并不起作用,而是需要自己tsc --init一个才好用。

cc点,点不出来

我很喜欢cc这个命名空间,这让项目看起来整洁很多,自己定义的模块也好,类也罢,即使再怎么随意也不会和cocos冲突,然而3.0之后,不知道为啥要弃用呢?

莫名其妙的GIT

这个着实让我很头疼,新建一个项目之后,出现一片绿色,吓得我还以为把项目建立到了一个已有仓库上了。


解决它的办法是删除掉项目目录下的Git,可是为什么再新建的时候一定要添加它进来呢?

图像资源Type问题

当我第一次把图像资源拖进assets里之后,打算常规使用时,发现放在里面的图片并不能直接放置到2D场景中,很不巧的是,在官方文档中也没有看到有关的说明,我一脸懵逼的状况下,突然想起来难道这和Unity一样?选择资源,改换类型,终于这才OK。
image
事实上,并不是所有的开发者都精通各种引擎,这种变化,还是会直接影响到开发者的学习成本,建议工具多让小白或者不明白的人来测试,要知道数学老师能给小孩子讲明白数学应用题,而一般人则不能,是因为教师不会理所当然认为小孩子会某些知识或者经验。

2D摄像机分组问题

当我终于把资源拼接好,然后完成漂亮的布局之后,准备愉快的运行开启开发之旅时,一片漆黑的界面,直接又让我怀疑,是不是哪里姿势不对,奇怪啊,为啥是的黑的呢?什么都没有,明明就是这个场景啊。


这个问题也没有找到答案,通过分析Label和Sprite的例子,结合其他引擎的知识,才知道要选择Layer成为UI_2D
image

声音事件问题

我作的这个游戏,是一个音乐游戏,然而声音在iOS上一直都不是特别的友好,要不然我在上周就发DEMO链接了,这周末才有空仔细研究体验,其中一个解决方案我想是通过监听声音的载入事件来完成对声音的控制,但是这个部分AudioSource似乎并不能解决我的问题,因为我看了源码,貌似根本就没有事件抛出,因此这个游戏就只好对iOS系统进行判定,作特殊的点击开始处理了。
我也试图想通过API文档的搜索,结果发现这文档根本就没这个功能。。。。

平台判断的问题

承接声音问题的后续,然而,3.0的API和2.x有很大的区别,我想找一下sys的平台字段判定,又回到了API文档搜索的问题上,无解。
只好自力更生在cc.d.ts中发现sys居然是一个Record<string, any>,也就是意味着内容全靠自己猜,唯一可行的办法只有log出来才能推测具体参数是什么,但是我还是小看了cocos的挖坑能力,因为我看到了满屏的弃用:
image
通过Log出sys.platform才能看出到底是什么平台,这样的话就可以通过sys.Platform的定义值来判断系统作逻辑了,但是我还是太天真了,因为代码运行的预期和自己想的不一样,经过排查,请看下图,哪有枚举值和输出值对不上的接口代码啊。

总结

好了,我先顺口气…………
CocosCreator 3.0以后确实改进了不少,但是用户的学习成本不但没有减少,反而增加了,3的版本总体来看确实有很大的革新,但是步子貌似跨的有点大,从我一个从1到2再到3的老用户来看,Creator越来越向专业性发展,有更炫的Case,有更牛X的特性,这是好事,但是不可否认的是泯灭一些易用性和易学性,我认为任何一个好的工具应当是能够带来生产力的提高,要么能够带来效率,要么带来质量,要么降低成本,在Creator 2身上似乎看到了一丝企盼看,却又很快渐行渐远,当我向学生吹嘘Creator 2版本易用的后续,却是3的望而却步,又当是何等的悲哀。

一爸作游戏,越来越有戏:)
Nowpaper
2021年六一儿童节前夕

2赞

感谢反馈~ 引擎组打印传阅~

1赞

为了造福社区,大神辛苦了!

npm模块使用起来怪怪的。似乎是打开编辑器时,预先记录到一个chunks.json里,然后后续的模块引用,就通过这个json去查找,当我开发时,新安装npm,需要关掉重启才行。但是但是,可能重启也不行。。。
组件代码引用了npm模块A,
npm模块B引用了npm模块A
然后就会报错,npm模块B没办法解析出npm模块A
后续再细查

希望声音这块能好好优化,现在确实不好用。感觉还不如以前2.x的AudioEngine。很多声音并不需要3D音效,简单快捷灵活的播出一个声音才是小游戏的刚需吧

这个感觉还是引擎组的锅,因为这个dts应该是程序自动生成的,感觉有些地方确实没有手写的好用。而且,强烈建议,temp里的cc.d.ts不要强引用引擎Editor内部的dts,这样会导致我明明想修整一下这个dts,但也只能在editor内部修整,这让我怎么上传git给其他人共享? 以前2.x的直接在项目内生成一份就挺好,改了就同步上传就行。

其实这些都不是问题,当你感觉3.1在原生上面各种bug,性能的问题的时候,才知道啥叫真正的恶意

引擎组回复:阅!
嗯,接下来看我怎么坑你们!

ts的nullable是语言问题啦,你可以试试把strictNullChecks设置为false,这样linter应该不会提示错误了。 :joy:

这块代码提示确实是 3.0 开始就一直存在的问题,只不过 3.1 开始弃用了大量 sys 接口,

目前还是尽量做到了不影响现有的项目判断,只不过开发体验上不是很友好,我们会在后续版本里完善下这块代码提示

请问你遇到的具体问题是什么呢,我们看看能不能处理下

是需要监听音频的播放事件吗

仁者见仁智者见智吧,不习惯可以把“strictNullCheck” 关闭。但请别忘了,你 tsc --init 出来的也是默认开启的。参考吐槽了 TypeScript 这个语言本身

不过我也不知道是不是自己的姿势不太对新建项目带的tsconfig.json里"extends": "./temp/tsconfig.cocos.json"并不起作用,而是需要自己tsc --init一个才好用。

应该是姿势不对。

cc点,点不出来

当你尝试直接输入 Vec3,看是否它有自动提示?这个东西就是模块,自 3.x,所有引擎功能是在模块里的,不是在全局命名空间的。

莫名其妙的GIT

.mtl 是材质文件,.meta 是对同名资源的设置文件,.gitignore 是 git 忽略清淡,package.json 记录了 npm 依赖、项目名、项目类型。tsconfig.json 记录了脚本 IDE 设置。没有哪一项是莫名其妙的。

新安装npm,需要关掉重启才行

可能是 BUG,我验证下。

组件代码引用了npm模块A,
npm模块B引用了npm模块A
然后就会报错,npm模块B没办法解析出npm模块A

这个有示例吗?

1赞

个人采取的办法是取消严格模式。

因为不需要cc.Vect3,直接Vect3就可以了。个人感觉比以前反而方便了很多。

删掉里面的git文件夹就可以了。

这个的确比较烦,希望引擎组有一个更好的解决办法。

Cocos是开源的,文档里没有可以源码里找。

内部讨论了一下,目前的原因是我们要设置忽略换行符,不然太多用户没处理换行符,导致提交的时候出现大量修改,换行符配置只能在 .git 里,所以用户电脑有 git,我们就会帮忙初始化一下。

1赞

我这边在windows好像没问题,今天成功构建出来了。
昨天是在mac上使用的,就会出问题。
我这边是使用monorepo的方式的,node_modules在项目根目录之上
测试示例
https://gitee.com/AIGAMESTUDIO.AILHC/EasyGameFrameworkOpen
demo项目在examples/egf-ccc3-full

环境初始化需要yarn,yarn需要安装到全局。
然后在根目录执行yarn install 即可

周末我刚好看见你一脸焦灼, :joy: :joy: :joy:

’莫名其妙的GIT‘说得是,新建项目会自动给配置一个.git,这样的话,你会看到一大堆git文件状态检查,这对新建项目来说没意义。

cc.这个问题,是在说命名空间的优势,不是不会用模块import

请保持幽默的心态看待反馈:)

:rofl:高手高手高高手