Error with glTF loader module in recent 5.0.1+ releases

[kaliatech]

Worked until 5.0.0, but then in 5.0.1 (and 5.0.2), trying to build/package results in errors like this:

node_modules/@babylonjs/loaders/glTF/2.0/glTFLoader.d.ts:11:32 - error TS2307: Cannot find module 'babylonjs-gltf2interface/.js' or its corresponding type declarations.

The incorrect import looks like this:

import type { IProperty } from "babylonjs-gltf2interface/.js";

This simple vite repo can be used to reproduce:

• GitHub - kaliatech/babylon-docs-vite-webxr: Example project setup for WebXR development using Babylon.js ES6 modules.

Simply change the package.json from:

• "@babylonjs/*": "5.0.0"
  to
• "@babylonjs/*": "5.0.2"

---

Aside: One non-obvious recent change for anyone doing WebXR work with ES6 modules, is that at some point in the recent 5.0.x releases, it became necessary to also import the animatable side-effects in order to avoid errors loading controllers. These docs should eventually be updated/replaced when things stabilize.

[sebavan]

cc @RaananW

[sebavan]

I ll try to have to have a quick look, no promises…, but @RaananW will be back tomorrow

[sebavan]

You can follow the resolution here error TS2307: Cannot find module 'babylonjs-gltf2interface/.js' or its corresponding type declarations. · Issue #12330 · BabylonJS/Babylon.js · GitHub

[RaananW]

This will be resolved soon with 5.0.3. Probably in the next hour or two.

[simon]

Hey!

@RaananW @sebavan @kaliatech

I think i have an a ocasion to awake this topic again. I didn’t have any troubles on version 5.5.6 but if i switch version on 5.12.1 i got a set of equal errors:

[RaananW]

have you installed this dependency? if not, make sure you install any version above 5. prefferably 5.12.1

[simon]

Yes i was installed this dependency.

When i use version of package 5.5.6 everything is OK

But if i use 5.12.1 i had get a error

[RaananW]

Can you share your package.json? we have moved to peer-dependency resolution, so it might be the issue at hand.

[simon]

With this package i got a error

When i use package with versions 5.5.6 all is ok

[sebavan]

Looks like you would need to add https://www.npmjs.com/package/babylonjs-gltf2interface as a dependency

[RaananW]

I wonder - your npm install command should actually notify you that there are missing peer dependencies. Is it not the case?

[simon]

Yeah…

Sorry about that and about my long time answer.

I just skipped npm message

Now all is work! Thank tou @sebavan & @RaananW

[brightMoon]

I have configured it, but there will still be errors.
@sebavan @RaananW

[RaananW]

no need to add it to types (no need to add any of them to types) typescript is dealing with it on its own. The gltf2interface package has no main file, it is pure typing. Are you importing something directly? Can you share your setup?

[brightMoon]

Here’s how I introduced it:

[RaananW]

I meant the project itself, how is the compilation being done.
Typescript should consume the typings only. the gltf2interface package has no compiled source, as it has no active code. It does have a few enums (and other types) that your compiler might try to convert to code, but that should be a part of your project and is not a part of the package itself. At least this is the intension of the package.

[brightMoon]

This is the configuration:

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "skipLibCheck": true,

    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve",
    "allowJs": true,

    "strict": true,
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "noFallthroughCasesInSwitch": true,
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    },
    "types": ["@babylonjs/core", "@babylonjs/loaders"],
    "composite": true
  },
  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "test/**/*.ts"],
  "exclude": ["src/meta3d/libs/stats.module.js"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

[brightMoon]

I wrote it with reference to glTFLoader.ts

BabylonJS/Babylon.js/blob/35e9ef5f7769c7b6f28e43b28a948012f373411f/packages/dev/loaders/src/glTF/2.0/glTFLoader.ts#L31

[brightMoon]

If all use import type {xxx} from ‘babylonjs-gltf2interface’, the project can run normally, but the ts code will prompt