如何用CocosCreator制作微信小遊戲

Posted on by

CocosCreator在1.8版本開始，就支持一鍵發佈微信小程序，下面是詳細的發佈步驟：

1、在微信公眾平臺下載微信開發者工具

 地址： https://mp.weixin.qq.com/debug/wxagame/dev/devtools/download.html?t=2018115，根據需要選擇相應的版本。

2、cocoscreator設置

選擇Cocos Creator –> 偏好設置 –> 原生開發環境，配置WechatGame程序路徑，點擊保存並關閉。

3、配置構建發佈

下面的界面：

 遊戲名稱根據需要自己寫入，發佈平臺懸著Wechat Game，appid可以暫時不填寫，因為微信小遊戲是可以支持無appid的調試，但是會有功能受到限制。根據項目需要，選擇初始場景以及參與構建的場景。MD5 Cache的勾選，根據官方文檔，是為瞭進行版本控制（不明白就先勾上，下文會用得到）。詳細內容可以參考官方文檔。 當你看到箭頭3指向的內容顯示completed，則表示已經構建成功瞭。因為我是直接構建成功，沒遇到什麼意外情況，所以是不是有坑，我就不清楚瞭，如果遇到瞭問題，最直接的辦法就是使用creator的helloworld工程進行編譯，如果沒有編譯成功，就檢查下自己的環境是不是配置的有問題。 一切OK，點擊運行。

4、打開小程序項目

如果你是第一次打開，會看到下面的界面：

選擇小程序項目，進入下面的界面 

選擇項目目錄，(項目路徑)\（項目名稱）\build\wechatgame，如果有appId，直接填寫，也可以註冊，我隻是做一個demo，趟趟雷，所以直接選擇小遊戲，點擊確定。

5、進入微信開發工具 

這時候你就可以看到你編輯的遊戲界面瞭，你也可以直接在界面上直接遊戲，檢驗下遊戲有沒有問題。順便給小白推薦個教程， http://www.byjth.com/CocosCreator/66.html閉眼就天黑的博客，很適合小白學習怎麼使用creator去做遊戲，隻看教程是沒用的，重點還是多學多做。這個遊戲就是照著他的教程擼出來的。

6、編譯

可以在工具上的左側模擬器界面看到這個小遊戲的運行。

7、預覽

可以通過微信的掃一掃在手機上體驗你的第一個小遊戲。但是有一個需要註意的地方，如果按照這個教程來走的話，你可能會遇到這個問題（ 代碼包大小為 xxxx kb，上限為 4096 kb，請刪除文件後重試 ），如果運氣好，包體大小正好小於4096kb，那就可以用手機玩玩瞭。好瞭，別著急，現在來填坑。 根據官方文檔介紹，在小遊戲的環境中，資源管理是最特殊的部分，其中就有一條，  小遊戲的包內體積不能夠超過 4mb，包含所有代碼和資源，額外的資源必須通過網絡請求下載。這就有點尷尬瞭，隻有4m，那就隻能使用網絡下載瞭，不要擔心，處理起來很簡單，因為cocoscreator已經給我們封裝好瞭，可以直接調用。 具體操作步驟如下：

  • 在構建時，勾選md5Cache，上文已經勾選瞭，如果沒有勾選，請重新build一下。
  • 將小遊戲發佈包中的res文件夾完整的上傳到服務器。
  • 刪除發佈包中的res文件夾。
  • 在 main.js 中，找到對應代碼段並添加 REMOTE_SERVER_ROOT 的設置 require(‘libs/wx-downloader.js’); // 添加這行代碼，將 URL 修改為正確的 res 遠程路徑。 wxDownloader.REMOTE_SERVER_ROOT = ‘https://www.xxx.com/remote-res/’; boot();PS：如果你不太瞭解在哪裡加，在main文件搜索boot（）;找到 else if ( true ) ，就在這兒加。另外，網絡地址指向的是res的父目錄，即res的上一層。不過，後面發現在game.js下面也有這個路徑，我直接在那裡寫入瞭網址，也是ok的，具體情況不太清楚，總之兩處寫一處就好。
  • 對於測試階段來說，可能你無法部署到正式服務器上，需要用本地服務器來測試，那麼請在微信開發者工具中打開詳情頁面，勾選項目設置中的 不檢驗安全域名、TLS 版本以及 HTTPS 證書 選項。

8、預覽成功

會生成一個二維碼，使用微信掃一掃，打開小遊戲，這時候，你可能看到有編譯異常，不用太在意，先看下運行效果。你可能看到的是全黑的一屏，點擊右上角的…選擇打開調試，重新掃一下二維碼，這時候手機上就可以運行瞭。
至此，小遊戲的開發部署算是完成瞭。

以上就是如何用CocosCreator制作微信小遊戲的詳細內容，更多關於CocosCreator制作微信小遊戲的資料請關註WalkonNet其它相關文章！

推薦閱讀：

    None Found