# ActionManager and pointer events not suppoorted when creating my own bundle with ES6

**URL:** <https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349>\
**Category:** Questions\
**Created:** [March 20, 2021, 10:17pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349 "2021-03-20T22:17:55Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![joselea](https://avatars.discourse-cdn.com/v4/letter/j/ecccb3/32.png) [@joselea](https://forum.babylonjs.com/u/joselea)\
**Post date:** [March 20, 2021, 10:17pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/1 "2021-03-20T22:17:55Z")

</div>

Hello! I’m using Babylon Core and GUI version 4.2.0

**Problem:**  
My scene has a bunch of meshes with action managers to handle `OnPickTrigger` and `OnPointerOverTrigger`. Everything works great if I use the babylon min file from the dist folder on GitHub or the CDN but they stop working if i use my own bundle. @sebavan **I think there must be some import that I’m missing.**

**What I am doing:**  
I create my own bundle because of file size constrains; to do so, I have a js file that imports the required modules from `node_modules` and then use rollup to create the final min.js file.

rollup exports everything as an `iife` under the name `BABYLON`. Later own I call `BABYLON.Engine`, `BABYLON.Scene` there are no console errors and everything works as expected except that the events are never raised, meshes for example do not respond to pointer events, nor show the mouse cursor as a pointer. I am unable to reproduce this in the playground because the files are already loaded.

**Example:**

package.json

```auto
 "dependencies": {
        "@babylonjs/core": "4.2.0",
        "@babylonjs/gui": "4.2.0"
    },
    "devDependencies": {
        "@rollup/plugin-node-resolve": "7.0.0",
        "rollup": "1.16.2",
        "rollup-plugin-terser": "^7.0.2"
    }

```

index.js

```auto

import '@babylonjs/core/Materials/Textures/rawTexture';
import '@babylonjs/core/Materials/Textures/dynamicTexture';
import '@babylonjs/core/Shaders/layer.vertex.js';
import '@babylonjs/core/Shaders/layer.fragment.js';

import {ActionManager} from '@babylonjs/core/Actions/actionManager';
import {ExecuteCodeAction} from '@babylonjs/core/Actions/directActions';
import {Animation} from '@babylonjs/core/Animations/animation';
import {ArcRotateCamera} from '@babylonjs/core/Cameras/arcRotateCamera';
import {Engine} from '@babylonjs/core/Engines/engine';
import {Effect} from '@babylonjs/core/Materials/effect';
import {Material} from '@babylonjs/core/Materials/material';
...
import {VertexBuffer} from '@babylonjs/core/Meshes/buffer';
import {Mesh} from '@babylonjs/core/Meshes/mesh';
...
import {Scene} from '@babylonjs/core/scene';
import {AdvancedDynamicTexture, Button, Control, Line, Rectangle, Slider, TextBlock} from '@babylonjs/gui/2D';

const GUI = {
  AdvancedDynamicTexture,
  Button,
  Control,
  Rectangle,
  Slider,
  TextBlock,
  Line
};

export {
  Engine,
  Scene,
  ArcRotateCamera,
...
  ActionManager,
...
  Animation,
  ExecuteCodeAction,
  VertexBuffer,
  GUI
};

```

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [March 21, 2021, 4:16pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/2 "2021-03-21T16:16:16Z")

</div>

Please try to not use BABYLON as it conflicts with the UMD hack we have in place, could you try renaming to another variable ?

@RaananW also had trouble with rollup and might be able to provide his workaround.

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [March 22, 2021, 12:16pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/3 "2021-03-22T12:16:17Z")

</div>

I did experiment with rollup a few months ago and managed to get the scene to render, but i never finalized the update in my bootstrap project. would you be able to share your project so I can help you debug?

---

<div class="post-metadata">

**Author:** ![joselea](https://avatars.discourse-cdn.com/v4/letter/j/ecccb3/32.png) [@joselea](https://forum.babylonjs.com/u/joselea)\
**Post date:** [March 22, 2021, 7:42pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/4 "2021-03-22T19:42:30Z")

</div>

Thanks @RaananW!  
I created this small example with the most basic form of the problem, you can follow the instructions in the README file on how to create your own bundle.  
I’m attaching a zip folder, let me know if there is a better way to share this.

[babylon rollup example.zip](https://forum.babylonjs.com/uploads/short-url/3tMPTfTHL3B4qS1SX5bs1HKaKta.zip) (1.1 MB)

---

<div class="post-metadata">

**Author:** ![joselea](https://avatars.discourse-cdn.com/v4/letter/j/ecccb3/32.png) [@joselea](https://forum.babylonjs.com/u/joselea)\
**Post date:** [April 7, 2021, 10:01pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/5 "2021-04-07T22:01:06Z")

</div>

@RaananW have you had any luck?

---

<div class="post-metadata">

**Author:** ![brianzinn](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/brianzinn/32/28013_2.png) [@brianzinn](https://forum.babylonjs.com/u/brianzinn)\
**Post date:** [April 8, 2021, 12:04am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/6 "2021-04-08T00:04:26Z")

</div>

hi @joselea - I’ll share some ideas since this thread stalled. Are you trying to bundle with your project - otherwise I see you are missing externals?

```json
{
   external: [...Object.keys(pkg.peerDependencies || {})],
   plugins: [...]
}

```

this project keeps the babylon as a vendor bundle in rollup config:  
[react-babylonjs/rollup.config.js at master · brianzinn/react-babylonjs (github.com)](https://github.com/brianzinn/react-babylonjs/blob/master/rollup.config.js)

If you bundle babylon with your project you can end up with some odd code as there are places in the code that will fail on some instanceof checks if you have babylon loaded twice with some misconfiguration!

I did a hacky not too long ago for somebody in the forum trying to bundle babylon from source and I used rollup:  
[babylon-ssg-rollup/rollup.config.js at main · brianzinn/babylon-ssg-rollup (github.com)](https://github.com/brianzinn/babylon-ssg-rollup/blob/main/rollup.config.js)

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [April 8, 2021, 8:48am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/7 "2021-04-08T08:48:51Z")

</div>

So sorry, i was away for 2 weeks.

I have some catching up to do, it’s on my todo list.

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [April 8, 2021, 8:48am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/8 "2021-04-08T08:48:55Z")

</div>



---

<div class="post-metadata">

**Author:** ![joselea](https://avatars.discourse-cdn.com/v4/letter/j/ecccb3/32.png) [@joselea](https://forum.babylonjs.com/u/joselea)\
**Post date:** [April 22, 2021, 9:30pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/9 "2021-04-22T21:30:18Z")

</div>

Thank you for the pointers @brianzinn!  
I tried modifying the project i provided in the zip folder above with different rollup configurations following the two examples you provided, unfortunately the actionManager is still not responding.

---

<div class="post-metadata">

**Author:** ![brianzinn](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/brianzinn/32/28013_2.png) [@brianzinn](https://forum.babylonjs.com/u/brianzinn)\
**Post date:** [April 23, 2021, 12:18am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/10 "2021-04-23T00:18:54Z")

</div>

@joselea I have a few working examples with externals using rollup, so just to make sure it’s not the rollup config - what is your code like - here is an example that I use that works:

```auto
 mesh.actionManager = new ActionManager(mesh._scene)
    mesh.actionManager.registerAction(
      new SetValueAction(
        ActionManager.OnPointerOverTrigger,
        mesh.material,
        'wireframe',
        true
      )
    )
    mesh.actionManager.registerAction(
      new SetValueAction(
        ActionManager.OnPointerOutTrigger,
        mesh.material,
        'wireframe',
        false
      )
    )

```

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [May 27, 2021, 10:09am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/11 "2021-05-27T10:09:23Z")

</div>

Better late than never - for future reference the `Ray` class is missing, which is required for picking.

When you import the ray:

```javascript
import { Ray } from "@babylonjs/core/Culling/ray";

```

and export it in your `index.js`, the events will trigger as expected:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/d/c/dc2708c8b68d650d1451cabaed44826cda1b37b2.png)

---

<div class="post-metadata">

**Author:** ![RaananW](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/raananw/32/28955_2.png) [@RaananW](https://forum.babylonjs.com/u/RaananW)\
**Post date:** [May 27, 2021, 10:09am UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/12 "2021-05-27T10:09:26Z")

</div>



---

<div class="post-metadata">

**Author:** ![joselea](https://avatars.discourse-cdn.com/v4/letter/j/ecccb3/32.png) [@joselea](https://forum.babylonjs.com/u/joselea)\
**Post date:** [June 1, 2021, 9:43pm UTC](https://forum.babylonjs.com/t/actionmanager-and-pointer-events-not-suppoorted-when-creating-my-own-bundle-with-es6/19349/13 "2021-06-01T21:43:45Z")

</div>

Thank you so much @RaananW this fixed the problem!