微信小游戲開發(fā)文檔-小游戲開發(fā)基礎(chǔ)教程-模塊化

模塊化

小游戲提供了 CommonJS 風(fēng)格的模塊 API，可以通過 module.exports 和 exports 導(dǎo)出模塊，通過 require 引入模塊。假設(shè)代碼包有如下結(jié)構(gòu)，src/util 目錄下的是一些在游戲中會反復(fù)用到的方法，res/image 目錄下則是游戲中會用到一些圖片。

├── game.js
├── game.json
├── src
|   └── util
|       ├── drawLogo.js
|       └── ...
└── res
    ├── image
    |   ├── logo.png
    |   └── ...
    └── music
        └── bgm.mp3

其中，drawLogo.js 模塊封裝的是一個用來把 logo 畫到指定位置的方法。

module.exports = function (canvas, x, y) {
    var image = new Image()
    image.onload = function () {
        var context = canvas.getContext('2d')
        context.drawImage(image, x, y)
    }
    image.src = 'res/image/logo.png'
}

注意，當(dāng)用加載本地的圖片、音頻、視頻資源時，必須寫從代碼包根目錄開始的絕對路徑。如果寫以 drawLogo.js 所在目錄的相對路徑，則會導(dǎo)致系統(tǒng)找不到資源文件，加載失敗。

image.src = '../../res/image/logo.png'

在 game.js 中 require drawLogo，就可以調(diào)用 drawLogo 模塊導(dǎo)出的方法。

var drawLogo = require('./src/util/drawLogo')
var canvas = wx.createCanvas()
drawLogo(canvas, 40, 40)