# Can't run Babylon GUI with Webpack

**URL:** <https://forum.babylonjs.com/t/cant-run-babylon-gui-with-webpack/49858>\
**Category:** Questions\
**Tags:** gui, webpack\
**Created:** [April 20, 2024, 11:43am UTC](https://forum.babylonjs.com/t/cant-run-babylon-gui-with-webpack/49858 "2024-04-20T11:43:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![MadChicken](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/madchicken/32/35754_2.png) [@MadChicken](https://forum.babylonjs.com/u/MadChicken)\
**Post date:** [April 20, 2024, 11:43am UTC](https://forum.babylonjs.com/t/cant-run-babylon-gui-with-webpack/49858/1 "2024-04-20T11:43:30Z")

</div>

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:

```auto
"@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](https://github.com/jkukuryk/babylon_GUI_sample)

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

---

<div class="post-metadata">

**Author:** ![aWeirdo](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/aweirdo/32/52_2.png) [@aWeirdo](https://forum.babylonjs.com/u/aWeirdo)\
**Post date:** [April 20, 2024, 12:00pm UTC](https://forum.babylonjs.com/t/cant-run-babylon-gui-with-webpack/49858/2 "2024-04-20T12:00:04Z")

</div>

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](https://doc.babylonjs.com/setup/frameworkPackages/npmSupport#available-packages)

list of ES6  
[https://doc.babylonjs.com/setup/frameworkPackages/npmSupport#es6](https://doc.babylonjs.com/setup/frameworkPackages/npmSupport#es6)

---

<div class="post-metadata">

**Author:** ![MadChicken](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/madchicken/32/35754_2.png) [@MadChicken](https://forum.babylonjs.com/u/MadChicken)\
**Post date:** [April 20, 2024, 12:15pm UTC](https://forum.babylonjs.com/t/cant-run-babylon-gui-with-webpack/49858/3 "2024-04-20T12:15:56Z")

</div>

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

Thank You!
