Babylonjs + Typescript + glTF Loader + webpack revisited

Hi there! I’m really enjoying working with Babylon; I’ve been doing all my dev work in Typescript for the last few years and it’s great to see such a fully realized engine built with complete typescript support.

I’m exporting my models from Blender in glTF format and attempting to get them loaded in my Typescript + Webpack project, and I’m getting the dreaded “TypeError: Cannot read property ‘0’ of undefined” error specifically on material import (Update: manually removing materials from the glTF file just moves the error to a less specific property ‘0’ of undefined error). This seems to happen regardless of whether i use one of my files or a glTF file found on the web. I’m using babylonjs 3.3.0 and babylonjs-loaders 3.3.0 .

the full error when Loading/Appending a glTF file looks something like this:

Unable to load from /assets/gltf/test.gltf: loadAssets of unknown
	Materials:
		Name: MyFirstMaterialName
		Name: MySecondMaterialName TypeError: Cannot read property '0' of undefined
    at Function.d.FromArray (babylon.js:1)
    at Function._.Parse (babylon.js:1)
    at ar (babylon.js:1)
    at Object.load (babylon.js:1)
    at eval (babylon.js:1)
    at d (babylon.js:1)
    at XMLHttpRequest.o (babylon.js:1)

In other searches for this subject, i’ve seen a possible solution of including the babylon.js and babylonjs.loaders.js files manually in the index.html and manually moving typings into the project (presumably then removing the actual dependencies from the project), however i’d really prefer not to do this if at all possible.

I was wondering if anyone else is encountering this problem and/or if any new solutions have been found since the most recent reference to this issue i have seen is already over a year old. Is this a known issue with Webpack implementations, and/or are there any suggestions for alternate project build pathways? Thanks so much, really looking forward to expoloring Babylon more deeply.

1 Like

Well first welcome!!

Does it work if you manually add a reference to the loaders?(using script src)?

Can you also try to do a:
import “babylonjs-loaders”

?

Well, would you look at that! doing the complete import 'babylonjs-loaders'; seems to do the trick. still getting a 0 vertices count on the new scene, but definitely gives me more to play with and now completes loading without error. Might be worth a mention in the docs somewhere as webpack setups are getting more and more common these days; I forget where I even saw the initial setup but would be glad to recommend a note to be added if I run across it again.

Hopefully that clears it for anyone else encountering this stumbling block. Thanks so much for your quick reply, and for the engine itself!

Thanks for your kind words!

We are currently working on babylonjs 4.0 with a whole rework of our modules so this kind of issues will disappear

In the meantime do you want to help by updating this doc page? Babylon.js Documentation

Here actually:)

1 Like