ES6 Sourcemaps not lining up since 5.27.1

Bugs
,
1

Hi there, I was just wondering if anyone else has been running into this issue with Babylon.js recently.

We are using Babylon.js 5.57 (also tested with 6.14) on our project, and are using Rollup to bundle our files. We are using deep imports from babylon extensively, i.e.

import { PBRMaterial } from ‘@babylonjs/core/Materials/PBR/pbrMaterial’;
import { BaseTexture } from ‘@babylonjs/core/Materials/Textures/baseTexture’;
import { Texture } from ‘@babylonjs/core/Materials/Textures/texture’;
import { Material } from ‘@babylonjs/core/Materials/material’;
import { MultiMaterial } from ‘@babylonjs/core/Materials/multiMaterial’;
import { VertexData } from ‘@babylonjs/core/Meshes/mesh.vertexData’;
…
in order to save on bundle size.

It appears that sourcemaps don’t line up correctly anymore when bundling our application, when including the es6 Babylon modules. On Babylon.js 5.21.0, everything works as expected, on 5.22.0, I get “Bad Token” build errors and the whole project fails to build. On 5.27.1, the build completes successfully once again, but anything onwards from that version has source maps that are completely shifted from the real code. When you put breakpoints, they don’t get hit because the “real” breakpoint is on a completely different line. This can be seen when you disable the sourcemaps in chrome and the breakpoints move to unrelated places in the code. Debugging works fine with sourcemaps disabled.

I thought it was a rollup issue so converted our whole project to the latest version of Vite and am still seeing the same behavior with the sourcemaps. It’s evidently being caused by Babylon because when I change the version back to 5.21 the souremaps work perfectly again.

Has anyone else noticed this issue?

2

After looking more into this it appears the source maps are correct at the beginning of the bundle but become disconnected immediately after the shader fragments are bundled (all the thousand+ line strings are throwing something off)

1 Like
3

cc @RaananW

4

The sourcemaps in our es6 bundle are generated directly by typescript. In 5.21 we moved to a different target, but haven’t changed the build process in any way. I am using the es6 packages constantly and haven’t experienced any issue with sourcemaps not alligned, but of course that doesn’t mean that it is the same experience for everyone else.

Care to share a project where you notice this behavior, and I will be able to check what went wrong?

5

was just checking that. i found an interesting issue and am working on understanding it. Most sourcemaps do work, but some classes seem to be mapped incorrectly.

7

you are right - it is the shaders in es6. under certain conditions they don’t work correctly. this might be a typescript issue with the way we are building the shader code. I will continue investigating this.
The reason I am saying it might be a typescript issue is that the UMD version’s sourcemaps are working correctly, even with the shader files.

8

Fix sourcemaps compilation in es6 modules by RaananW · Pull Request #14134 · BabylonJS/Babylon.js (github.com)

10

Thank you for looking into this, that’s a relief!

1 Like