本帖最后由 Nasus 于 2018-9-7 09:53 编辑
很多新手都喜欢一个人完成项目,从项目的规划、搭建,到实施、debug、验收,一整套流程都是自己独立完成,对于提高自己的整体开发能力和自适应能力很有帮助,是一件很有成就感的事情。ok,不废话,下面开始介绍小白如何快速发布一个微信小游戏。 本文章使用的是以Egret官网示例demo的栗子。 提前准备工具工具是非常重要的,当然,也是很简单的。。。 项目分析列表在这个例子中,我们只分析小游戏调试时的步骤:Egret项目快速发布为微信小游戏,并且可以在本地调试,加载资源为服务器。 本教程原因 首先,微信小游戏分为“游戏包”和“本地缓存”两个存储空间,当开发者将微信小游戏在微信开发者工具中发布时,微信开发者工具会将所有微信工程中的源码和资源进行压缩打包,既“游戏包”,该包体积不能超过4M,这就很蛋疼,我们的游戏很好玩,只有4M连一半图片都不够存放,资源优化又不会做,只有靠删除素材资源才能维持代码运行这样子。 但是,前段时间白鹭引擎已经提供了动态加载机制,将游戏资源放置在一个外部CDN服务器上。这样就可以适当的解决体积不超过4M的这个问题了,不过,今天我们只是教大家如何在本地测试,所以没有购买服务器的小伙伴也不需要担心了,接下来开始实际操作
STEP1:新建一个项目 注意:项目名称不可用使用大写字母(wxgamedemo) STEP2:在浏览器中运行 STEP3:在Launcher 中发布为微信小游戏 但是有的小伙伴到这一步就出现报错的问题了,如下图 出现这种情况也别担心,我们直接打开微信开发者工具(大家需提前下载好微信开发工具),扫码登录 点击小游戏后可以不用AppID然后选择项目目录(此处为打包发布为微信小游戏后的文件夹) 确定 第一步就报错了,不支持showAll适配模式,推荐我们使用缩放模式为fixedwidth, 这里是因为我们最开始新建项目的时候缩放默认模式为showAll我们没有进行修改,在项目根目录下index.html中按下图修改即可 接下来我们顺便修改一下egretProperties.json中需要注意的点,将current 本来的web改为wxgame,然后在命令行中执行egret publish –-target wxgame重新编译一下项目 如下图 此处我们的微信开发者工具会自动进行刷新,进行预览,如果我们的资源没有超过4M的话就会出现二维码了。微信扫描二维码就可以在手机上预览调试自己的项目了 但是有的小伙伴项目,资源超过4M。就不会生成二维码而是会提醒如下 )进行修改代码,然后进行编译,又报错了,别着急,我们仔细看看错误,原来刚刚修改的代码是添加了一个插件,现在又找不到了,噢,我们好像没有引入这个插件 那我们引一下吧,如下图 到了这一步,我们的项目中加载的资源还是在从文件中加载的,并没有解决实际问题,别急,我们这一步要做的就是把资源放在服务器上,按照url的方式去加载 接下来按照我的思路一步一步来 打开项目的目录,查看是否有如图三个文件夹,如果不正确的话,请重头往下再阅读一遍文档 我们切到微信开发者界面看到应该是和我效果一样的黑屏 我们接下来要做的就是打开第三个项目文件夹 ,名称为项目名_wxgame_remote中,架设一台端口为 8080 的本地服务器 ,我这里是使用的node.js服务器,一个文件几行代码就跑起来了,大家也可以使用其他的本地服务器,不过服务器的根目录一定得设置为这个目录哦,然后我们再看看效果(线上服务器需使用FTP等工具将resource文件夹上传到服务器) 我们再编译一下,发现可以了(我这里换了张图片),我们看看打印的数据,图片加载的资源确实是从服务器上加载的,到这里还没有完哦,因为本地资源还在我们的项目内,我们需要把本地的资源从文件夹中把它给删除掉,按下图快速打开文件夹,顺便看看最后一个选项不检查https证书校验是否勾选 选择 项目名_wxgame文件夹将resource文件夹下的图片直接删除 我们再重新编译一下,预览二维码就可以了 时间匆忙,版式有点勉强,大家凑合着看,能解决问题就好啦。
|