melonjs-getting-started

1# Getting started with melonJS
2 
3> Bootstrapping a melonJS 20.x game: the `Application` lifecycle, the mandatory
4> `await app.init()`, the world container, and what the renderer fallback means
5> for feature availability.
6 
7**Applies to:** melonJS 20.x. Older major versions differ — see the
8`melonjs-20-migration` skill.
9 
10## The bootstrap
11 
12`Application` construction is synchronous but **initialisation is not**. `init()`
13returns a promise and must be awaited before building any renderable, loading
14assets, or entering a scene.
15 
16```js
17import { Application, Text } from "melonjs";
18 
19const app = new Application(1218, 562, {
20    parent: "screen",      // id of the DOM element to mount into
21    scale: "auto",
22    backgroundColor: "#202020",
23});
24await app.init();          // ← REQUIRED. Nothing below works without it.
25 
26app.world.addChild(
27    new Text(609, 281, {
28        font: "Arial",
29        size: 160,
30        fillStyle: "#FFFFFF",
31        textAlign: "center",
32        textBaseline: "middle",
33        text: "Hello World !",
34    }),
35);
36```
37 
38**This is the single most common thing to get wrong.** On 19.x the constructor
39called `init(width, height, options)` for you; on 20.x `init()` takes no
40arguments and calling — and awaiting — it is your job. Nothing that follows
41names the missing call. The constructor does build `app.world`, so adding a
42plain renderable succeeds and simply never draws — no canvas is appended and the
43…