BabylonJs ES6 Loaders not working after upgrading to 6.14.0

Bugs
1

Hello guys, this one is hard to reciprocate on the playground since I have a unique webpack setup but I’ll do my best to describe this issue. I am required to make a soft upgrade to the babylon.js library as we were previously using v5.28.0 to the v6.14.0 and I am using feature flags and npm aliases to have both the versions in the build by webpack with the v6.14.0 installed under the @babylonjs-v6 alias. But I am facing an issue when I dynamically load the loaders for v6.14.0 as they don’t seem to be in scope according to the console warning. Below is a simplified snippet of the dynamic import statements.


const mySoftCondition = true;

if (mySoftCondition) {
      BABYLON = await import('@babylonjs-v6/core');
      await import('@babylonjs-v6/loaders/glTF');
      await import('@babylonjs-v6/core/Debug/debugLayer');
      await import('@babylonjs-v6/inspector');
    } else {
      BABYLON = await import('@babylonjs/core');
      await import('@babylonjs/loaders/glTF');
      await import('@babylonjs/core/Debug/debugLayer');
      await import('@babylonjs/inspector');
    }

The above works fine when the soft condition is set to false i.e when using v5.28.0 but it crashes with these console warnings when the condition is set to true i.e when using v6.14.0.

Unable to find a plugin to load .glb files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf)

Any ideas why this is the case? Thanks in advance.

2

cc @RaananW, but I’m not sure we have packages named “@babylonjs-v6”: are these packages you renamed yourself?

3

Yes, I am using the v6.14.0 packages under an alias so I can have both versions running at the same time and choose which one to use at runtime.

    "@babylonjs-v6/core": "npm:@babylonjs/core@6.14.0",
    "@babylonjs-v6/gui": "npm:@babylonjs/gui@6.14.0",
    "@babylonjs-v6/gui-editor": "npm:@babylonjs/gui-editor@6.14.0",
    "@babylonjs-v6/inspector": "npm:@babylonjs/inspector@6.14.0",
    "@babylonjs-v6/loaders": "npm:@babylonjs/loaders@6.14.0",
    "@babylonjs-v6/materials": "npm:@babylonjs/materials@6.14.0",
    "@babylonjs-v6/serializers": "npm:@babylonjs/serializers@6.14.0",
4

The only reason it wouldn’t work as expected is if side-effects are not running correctly when importing an aliased package.
just as a test - does it happen when you actually update the @babylonjs/core package to 6.X?

1 Like
5

@RaananW just tested it and it works fine in the test branch with just updating the packages, is there something specific that should be run when aliasing?

6

I don’t have a lot of experience with aliasing like that from npm, so I am sorry to say that I have no idea how to fix it. But it is side effects for sure. maybe try adding sideEffects: true to your package.json and see if the packer deals with it a little differently?

7

@RaananW adding the sideEffects flag didn’t work but it makes sense that this is probably a webpack tree shaking problem blocking these sideeffects. maybe I need to look deeper but I think this is the right direction thanks.

1 Like
8

Try to clear everything in your npm cache as well, I once had similar problem when updating. There were some mismatching packages in some cache.

2 Likes