How does the gltf|glb loader work?

[Rubaka]

Hello!

I try to import gltf file but get an error:

Here is an example of how I do it using Append:

or using ImportMesh:

I also tried to import the loader in different ways:

import '@babylonjs/loaders/glTF'

I get the same error:

logger.js:70 BJS - [16:17:54]: Unable to find a plugin to load .gltf files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf) see: Loading Any File Type | Babylon.js Documentation

In https://sandbox.babylonjs.com everything works well.

Help me understand what I’m doing wrong? Thank you for any help!

[JCPalmer]

I know nothing about glTF, but as the guys are busy doing 5.0 prep, I can say that to keep the file size down, that plugin is in a different js file.

I need it for things in the framework, which are in that format.

 <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>

You could also use the cdn, instead of preview.

[sebavan]

cc @RaananW, but import “@babylonjs/loaders/glTF” should be working.

Could you share a repro ?

[RaananW]

just a side question while you preparing your reproduction - are you using the same version for the loaders and core?

[kaliatech]

I suspect the problem is with your packaging/build setup. Based on your first screenshot, it looks like you are trying to use the ES6 variant.

Key packages:

  "dependencies": {
    "@babylonjs/core": "^5.0.0-rc.4",
    "@babylonjs/loaders": "^5.0.0-rc.4"
  },

Important imports:

import { SceneLoader } from "@babylonjs/core/Loading/sceneLoader";
....
// Enable GLTF/GLB loader (side-effects)
import "@babylonjs/loaders/glTF";

Since you tried all of that, afaict, then this error is what indicates the problem is most likely with your build/packaging setup:

Unable to find a plugin to load .gltf files…

This codesandbox uses ES6 and shows that it should be working:

• https://codesandbox.io/s/babylon-gltf-example-tf3rnb?file=/src/main.ts

If this line is removed/commented-out, then will see same error:

• import "@babylonjs/loaders/glTF";

[sebavan]

@kaliatech this is great !!!

[Rubaka]

@kaliatech

"@babylonjs/loaders": "^5.0.0-rc.4"

All my variants turned out to be working, just the version of the packages did not match. Thank you very much for your help!

It would be great if we could get a package incompatibility error, but I do not know if this is possible, although nothing is impossible)

A working example, if someone will be looking

import { Mesh, Scene, Vector3, SceneLoader } from '@babylonjs/core'
import '@babylonjs/loaders'

export default class Body {
    scene: Scene

    constructor (scene: Scene) {
      this.scene = scene

      SceneLoader.Append(
        'resources/graphics/meshes/',
        'player.gltf',
        scene,
        undefined,
        undefined,
        undefined,
        '.gltf'
      )