搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

ztq發表於2018-01-01

前言

相信這兩天大家都被微信推出的小遊戲刷屏了吧。大家比較熟知的可能是“跳一跳”,但是其實微信首發了15款遊戲,其中8款遊戲用的是 Cocos 遊戲引擎。下面為大家介紹一下 Windows 64 平臺下如何搭建基於 Cocos2d-x 的小遊戲開發環境。

準備

安裝時直接選擇下一步即可。 注意目前最新的微信開發者工具是12月28號的,可以直接用我上面給出的連結去下載。

過程

一、Cocos Creator 部分

  1. 開啟 CocosCreator (第一次開啟需要登入cocos的賬號,可自行申請,略),新建一個工程。這裡我們建一個 Hello World 的工程。

    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x
    Hello World 工程開啟後的效果如下:
    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

  2. 設定微信開發者工具目錄。這裡注意選擇的是安裝資料夾,例如我的是 --> D:\Program Files (x86)\Tencent\微信web開發者工具。另外 NDK,SDK,ANT 如果你配置過的話會自動識別,此處不討論它們的安裝配置。

    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

  3. 構建工程。配置如圖所示,需要注意 appId 的填寫 ,本來需要在微信公眾平臺將小程式的類別設定為小遊戲類目才可以正常執行,但是由於微信目前(截至2017-12-30)尚未開放小遊戲的許可權設定,個人開發者無法改為這個類別,公司認證賬號暫時也不行,參考此連結。微信為了照顧想搶先體驗小遊戲開發的開發者準備了一個 appId: wx6ac3f5090a6b99c5 用於體驗。所以現在可以先用此appId進行體驗,等到以後微信開放了小遊戲的申請後再更換回自己的appId。

    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x
    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x
    注意不要點 執行,目前微信開發者工具貌似有bug,如果直接點 執行,微信開發者工具將會報 “Error: 未找到入口 app.json 檔案” 的錯誤。下面我們用手動的方式在微信開發者工具中開啟專案。

二、微信開發者工具 部分

  1. 開啟微信開發者工具。

搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x
選擇 小程式專案
搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x
2. 開啟小遊戲工程,專案目錄為剛剛建立的 Cocos 工程目錄下的 build\wechatgame
搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

  1. 在微信開發者工具中預覽效果。

    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

  2. 掃碼在微信中驗證實際的效果。

    搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

搶先體驗版 - 教你一步步搭建微信小遊戲開發環境 -- 基於Cocos2d-x

參考資料

  1. Cocos 官網
  2. 微信小程式開啟遊戲支援!你準備好了沒?
  3. Creator v1.8 :微信小遊戲開發教程
  4. 小遊戲在微信開發者工具中的問題彙總(FAQ)

相關文章