Как встроить игру Phaser3 в html ⇐ Html

[Anonymous]

Я новичок в node.js иphaser3. Я следовал этому уроку вчера, пока все хорошо. Как встроить клиентскую игру в html-файл? Веб-пакет, который использует шаблон проекта Phaser3, просто берет index.html, который поставляется с шаблоном проекта, и ссылается на main.js (который, я думаю, является частью веб-пакета):

Код: Выделить всё

Учебное пособие по Phaser3 просто помещает конфигурацию Phaser и объект игровой сцены в один и тот же html-файл. Мне это решение не нравится, я уверен, что есть способ поместить все сцены в отдельные файлы. Но как?
Если я сделаю следующее (измененный шаблон проекта Phaser 3):
src/scenes/MaGame.js

Код: Выделить всё

import Phaser from 'phaser';
import logoImg from '../assets/logo.png';

export default class MyGame extends Phaser.Scene {
constructor() {
super();
}

preload() {
this.load.image('logo', logoImg);
}

create() {
const logo = this.add.image(400, 150, 'logo');

this.tweens.add({
targets: logo,
y: 450,
duration: 2000,
ease: "Power2",
yoyo: true,
loop: -1
});
}
}

game.html

Код: Выделить всё

my title






const config = {
type: Phaser.AUTO,
parent: 'phaser-example',
width: 800,
height: 600,
scene: MyGame
};

const game = new Phaser.Game(config);

Я получаю следующую ошибку, когда открываю файл game.html (в консоли разработчика) или перехожу к нему:
Uncaught SyntaxError: невозможно использовать оператор импорта вне модуля — MyGame.js:1
Uncaught ReferenceError: MyGame не определен в game.html:20
Это не поможет: если я определяю его как модуль в package.json или переименуйте файл в .mjs, я не могу его запустить через npm start.
Итак вопрос: как мне правильно встроить игру в html файл? Для целей разработки запуск с помощью npm возможен, но как мне позже развернуть игру на веб-сервере? Кажется, я не могу найти никакой полезной информации по этому поводу, однако это, безусловно, очень простая тема.

Подробнее здесь: https://stackoverflow.com/questions/654 ... -into-html