https://github.com/littlee/wechat-small-game-phaser

make phaser works with wechat small game
https://github.com/littlee/wechat-small-game-phaser

phaser wechat wechat-game wechat-mini-program

Last synced: 3 months ago
JSON representation

make phaser works with wechat small game

• Host: GitHub
• URL: https://github.com/littlee/wechat-small-game-phaser
• Owner: littlee
• Created: 2018-01-10T09:40:40.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2020-08-14T02:19:02.000Z (over 4 years ago)
• Last Synced: 2024-09-29T23:40:01.563Z (4 months ago)
• Topics: phaser, wechat, wechat-game, wechat-mini-program
• Language: JavaScript
• Size: 943 KB
• Stars: 51
• Watchers: 5
• Forks: 6
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Wechat Small Game with Phaser.js

## Currently Using Phaser-CE Build

v2.16.0

## Main Idea

"Thanks to" the WeChat Small Game runtime environment, directly importing 'phaser' will get lots of errors.

## Solution

Stub some global variables which Phaser required, that's what 'js/libs/stub.js' does.

```js

import './js/libs/stub';

```

Use Phaser's split custom build instead of the standard version, which can expose PIXI, p2 and Phaser to global.

```js

window.PIXI = require('./js/libs/pixi');

window.p2 = require('./js/libs/p2');

window.Phaser = require('./js/libs/phaser-split');

```

Create the game instance with an object instead of multiple parameters, specify the `canvas` option.

```js

var game = new Phaser.Game({

  width: gameWidth,

  height: gameHeight,

  renderer: Phaser.CANVAS,

  canvas: canvas,

  state: {}

});

```

## Caveats

### Input Pointer

If the game size is not the same as the canvas', you should set scale mode to make Phaser calculate input pointer correctly.

```js

this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;

this.scale.pageAlignHorizontally = true; // optional

this.scale.pageAlignVertically = true; // optional

```

### Audio Playing

The Phaser built-in audio API won't work, however, we can use the Audio API from the adapter.

```js

let au = new Audio('path/to/audio.mp3');

au.play();

au.pause();

```

### Loading JSON files

Loading JSON file with a relative path won't work, you have to put the JSON file on the server and load it with a URL.

```js

this.load.json('version', './a.json'); // ERROR T_T

this.load.json('version', 'http://phaser.io/version.json'); // WORKS YoY

```