WeCaht Game tutorial:https://mp.weixin.qq.com/debug/wxagame/dev/index.html
I tried to do it, but I couldn’t get through
import './../playcanvas-stable.min.js'
let app
/**
* 游戏主函数
*/
export default class Main {
constructor() {
this.restart()
}
restart() {
app = new pc.Application(canvas, {});
app.start();
}
}
What needs to be done to be compatible with WeChat games?
As a stupid question, are you sure that the file path is correct?
I’m sure！
I am using the WeChat game API now, without the BOM and DOM running environment, no global document and window objects. How do you need to be compatible with the WeChat game API?
WeChat API address: https://mp.weixin.qq.com/debug/wxagame/dev/document/render/canvas/wx.createCanvas.html
three.js is compatible!
playcanvas not plan to be compatible with WeChat small game platform? 
We had a few developers develop games for the WeChat platform using the editor. I may take a look this weekend in detail.
Is there an English guide to that WeChat page?
My guess is that PlayCanvas.js wasn’t designed for node.js module style imports/exports and may need some modification.
I tried to download the DevTools and the whole process is in Chinese so I didn’t get very far with it.
My guess is that PlayCanvas is not a module so therefore you can’t import it as is. I believe you can add support for it in one of the JSON config files in the project via an alias or similar.
I may play more with this over the weekend as I’m quite interested in this. Someone who has more web development knowledge may be able to help in the meantime.
The playcanvas engine uses document or window objects, which is incompatible with WeChat API. So need to modify the intermediate file (weapp-adapter.js) to be compatible with the playcanvas engine
Thank you, because the WeChat game platform is very hot in China, so it is very urgent that the playcanvas will be supported.
So I try to use egret, layabox or three.js.
I am eager for you to follow up 
I’m also wondering how other developers that used PlayCanvas with WeChat did it.
I’m beginning to think they may have just used an iFrame.
@WingUNO , can you help here please? 
Had another look at this. I’ve found one way to dynamically load the playcanvas script at runtime with success here: https://stackoverflow.com/questions/950087/how-do-i-include-a-javascript-file-in-another-javascript-file which looks like:
function loadScript(url, callback)
{
// Adding the script tag to the head as suggested before
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
// Then bind the event to the callback function.
// There are several events for cross browser compatibility.
script.onreadystatechange = callback;
script.onload = callback;
// Fire the loading
head.appendChild(script);
}
function createApp()
{
// create a PlayCanvas application
var canvas = document.getElementById('application');
var app = new pc.Application(canvas, { });
app.start();
// fill the available space at full resolution
app.setCanvasFillMode(pc.FILLMODE_FILL_WINDOW);
app.setCanvasResolution(pc.RESOLUTION_AUTO);
// ensure canvas is resized when window changes size
window.addEventListener('resize', function() {
app.resizeCanvas();
});
// create box entity
var cube = new pc.Entity('cube');
cube.addComponent('model', {
type: 'box'
});
// create camera entity
var camera = new pc.Entity('camera');
camera.addComponent('camera', {
clearColor: new pc.Color(0.1, 0.1, 0.1)
});
// create directional light entity
var light = new pc.Entity('light');
light.addComponent('light');
// add to hierarchy
app.root.addChild(cube);
app.root.addChild(camera);
app.root.addChild(light);
// set up initial positions and orientations
camera.setPosition(0, 0, 3);
light.setEulerAngles(45, 0, 0);
// register a global update event
app.on('update', function (deltaTime) {
cube.rotate(10 * deltaTime, 20 * deltaTime, 30 * deltaTime);
});
}
loadScript('/playcanvas-stable.js', createApp);
However, I believe that WeChat tools uses a builder of some sort like WebPack or Babel etc given the file structure you have shown above.
Usually with tools like those, there is support for libraries like PlayCanvas which are not modules via configuring the project config JSON file. (e.g here is WebPack’s example of doing so: https://github.com/webpack/docs/wiki/shimming-modules).
This would be the ‘correct’ way of including a library like PlayCanvas into a project like this.
You may have to dig into the documentation of WeChat to find out how.
Good luck and reply back on how you do it as it will be helpful for others !
Thank you for your patience. API is Chinese, and maybe you don’t understand it.
WeChat games do not have BOM and DOM operating environments, and there are no global document and window objects. So when you want to use DOM API to create elements such as Canvas and Image, it can cause an error.
exp:create canvas
document.createElement('canvas')
It’s wrong. 
You need to use WeChat game API to create Canvas
wx.createCanvas()
This is right. 
So the playcanvas engine may need to modify or use the intermediate file (weapp-adapter.js) to extend the method to be compatible with playcanvas
Like this：
var document = {
createElement: function (tagName) {
tagName = tagName.toLowerCase()
if (tagName === 'canvas') {
return wx.createCanvas()
}
else if (tagName === 'image') {
return wx.createImage()
}
}
}
Now you can use document.createElement ('canvas') to create canvas!
If the developer is going to modify the engine, it’s quite tired, so can the official give a solution?
Ah, I see now. There’s only a few places where the PlayCanvas core engine uses “document” so it will require someone to fork of on Gut hub and modify it to work.
The link you posted to three.js is someone’s fork of the original project.
Yes, I hope you can modify the engine branch. I urgently want playcanvas to run in Wechat games. This will be a perfect idea.
Erm, it would be something I would like a look at but with WeChat Developer Tools and documentation not being very English friendly, it’s not something I can do or even look at unfortunately.
Scratch that, just found this: https://github.com/apelegri/wechat-miniprogram-wiki
mini-programs != mini-game (wechat game)
Although they are WeChat, but not the same
wechat-miniprogram can not develop the game
they got english version now 
https://developers.weixin.qq.com/minigame/en/dev/index.html?t=18081820
I just posted a paid job for the migration 
hope some day we could export wechat mini game directly