微信小遊戲雲開發在cocos creator中的設定

之前用three.js手撸了一個微信小遊戲半成品，但是因為這種手撸的方式，程式和美術很難配合，而且開發難度和時間成本太大，最終決定還是用cocos creator進行微信小遊戲的開發。

微信小程式早已經推出了雲開發功能，大大節省了伺服器成本，可以說是個人開發者的福音。但是筆者在用ccc開發整合了雲開發功能的微信小遊戲時，遇到了問題：每次用ccc建構後，微信開發者工具中的雲開發目錄和配置都會被清除掉。每次都需要再次配置微信小遊戲雲開發目錄并把雲函數檔案重新複制一遍，非常蛋疼。。。

這方面cocos creator似乎并沒有給出官方的解決方案，搜尋了一下，發現網上也沒有靠譜的方案，要不治标不治本要不非常麻煩。筆者查詢了cocos creator的API文檔，發現ccc的擴充和插件功能還是很強大的，開發者可以定制項目建構流程，使用自定義釋出模版和擴充包建構流程，就可以完美的解決這個問題。文檔見 API文檔：定制項目建構流程。

下面我們就來說一說支援微信小遊戲雲開發的配置步驟：

• 在ccc項目根目錄下建立目錄：根目錄\build-templates\wechatgame\{雲開發目錄名稱}，例如game__project1\build-templates\wechatgame\functions
• 在項目目錄下或者是 

  ~/.CocosCreator/packages

  （Windows 使用者為 

  C:\Users\${你的使用者名}\.CocosCreator\packages

  ）目錄下，建立一個檔案夾，比如：WXServerlessDevSetting，之後再檔案夾下再添加兩個檔案：main.js 和package.json

// main.js

var path = require('path');
var fs = require('fs');

function onBeforeBuildFinish (options, callback) {
    Editor.log('Building ' + options.platform + ' to ' + options.dest); // 你可以在控制台輸出點什麼

    var projectConfigPath = path.join(options.dest, 'project.config.json'); // 擷取釋出目錄下的 project.config.json 所在路徑
        var script = fs.readFileSync(projectConfigPath, 'utf8'); // 讀取建構好的 project.config.json
        var projectConfigObj = JSON.parse(script);//反序列化為js對象
        projectConfigObj["cloudfunctionRoot"] = "functions"; //你希望設定的雲開發目錄（注意！第一步中的 根目錄\build-templates\wechatgame\目錄下的{雲開發目錄名稱} 要和 main.js中，cloudfunctionRoot屬性指派要一緻。）
        script = JSON.stringify(projectConfigObj); //重新序列化成json
        fs.writeFileSync(projectConfigPath, script); // 儲存 project.config.json

    callback();
}

module.exports = {
    load () {
        Editor.Builder.on('before-change-files', onBeforeBuildFinish);
    },

    unload () {
        Editor.Builder.removeListener('before-change-files', onBeforeBuildFinish);
    }
};
           

//package.json
{
  "name": "wx_serverless_dev_setting",
  "version": "0.0.1",
  "description": "微信小遊戲雲開發配置",
  "author": "your name",
  "main": "main.js"
}
           

• 建構後運作，如圖

  

• 成功設定了微信雲開發環境，如圖：

  

這樣做的好處是，你完全可以在ccc的項目根目錄\build-templates\wechatgame\{雲開發目錄}，用VSCode開發雲函數，每次建構都會把你最新的版本複制到微信小程式的生成目錄中。再也不需要開發者手動去複制粘貼了。

注：如果嫌麻煩，可以直接下載下傳插件Cocos Creator 微信小遊戲雲開發配置插件 ，代價是5個積分，好像還不算貴吧。（本來打算釋出在cocos的插件市場，哪知道一直是待稽核狀态，看來那個插件市場是廢了）