Can't run Babylon GUI with Webpack

Questions
,
1

Hello, I spend hours debugging this issue.
When I start GUI, there is a common error:
Cannot read properties of null (reading '_getComponent')

First I removed node_modules and installed them again packages:

"@babylonjs/gui": "^7.1.0",
"@babylonjs/loaders": "^7.1.0",
"babylonjs": "^7.1.0",
"babylonjs-loaders": "^7.1.0",
"babylonjs-serializers": "^7.1.0",

I run the initialization of GUI after the scene is created (tested even with timeout).
the EngineStore.LastCreatedScene is null;
This issue does not appear when running with CDN; I tested on Playground and jsFiddle.

But when I run it with import packages:
import * as GUI from '@babylonjs/gui/2D';
it didn’t work.

I have created a very simple repo extracted from my game workflow to show the issue.

https://github.com/jkukuryk/babylon_GUI_sample

Just run npm i and npm start - and open dev tools to see the error message.

2

I think you’re mixing UMD and ES6 packages?

the packages starting with @ are ES6, the others are UMD.
list of UMD packages:
https://doc.babylonjs.com/setup/frameworkPackages/npmSupport#available-packages

list of ES6
https://doc.babylonjs.com/setup/frameworkPackages/npmSupport#es6

2 Likes
3

Yes, indeed, I didn’t notice that there are two versions.
Now I also see I used loaders from both.

Thank You!