Issue with Babylon.js 7.x.x and Angular 18.2.4 – Type Errors

Bugs
1

Since early 2025, I’ve been unable to use Babylon.js version 7.x.x. I have 3-4 applications running on Angular 18.2.4, combined with TypeScript 5.4.5 and Babylon.js 7.x.0 (with the minor version varying depending on the project).

However, since the beginning of this year, whenever I delete my package-lock.json and node_modules and run npm install again, the installation completes successfully. But when I start my project with ng serve, I encounter multiple errors like:

  • "Type 'Float32Array' is not generic."
  • "Type 'Uint8Array' is not generic."

I have tested multiple versions of Babylon.js 7.x.0, but the error persists consistently. Interestingly, all my applications are currently running fine with 7.x.0 as long as I don’t reinstall dependencies.

This issue does not occur with Babylon.js 6.x.0. If I can’t find a solution, I’ll have no choice but to downgrade to version 6.x, which I’d prefer to avoid.

Any help or insights would be greatly appreciated. Thank you in advance!

2

First thing is to try running npm ci instead of npm install.

3

Would be amazing to have a repro as it should definitely not fail.

Could you share more about the issues ? more logs and error message ?

4

cc @RaananW

5

Reproduction would be great, yes.
Where are the errors coming from? What file or module is being referenced as the source of the error?

6

This seems like a similar error, also from the past month or so. Something to do with TypeScript 5.7 + Angular?
[Bug]: error TS2315: Type ‘Uint8Array’ is not generic. · Issue #19152 · mozilla/pdf.js

1 Like
7

Then it might be related to the fact that babylon also uses typescript 5.7. If that’s the case there is sadly little we can do TBH - wo won’t revert back to an earlier version of typescript.
I hope angular will release a version that supports ts > 5.7. However, skipLibCheck should do the trick in ignoring ts errors in dependencies.

8

Hello everyone,

First of all, a big thank you for your responsiveness! I finally found a solution and was able to pinpoint the exact issue.

Steps to Reproduce:

  1. Create a new Angular project and update it to Angular 18 with the appropriate dependencies.
  2. Add any version of Babylon.js 7 to the dependencies section of package.json.
  3. Open tsconfig.json and set "skipLibCheck": false (by default, it is true).

Unfortunately, since I’m new to the forum, I can’t upload my project directly. However, here are my package.json and tsconfig.json files:

package.json:

{
  "name": "babylon-bug-reproduction",
  "version": "0.0.0",
  "scripts": { ... },
  "private": true,
  "dependencies": {
    "@angular/animations": "^18.2.4",
    "@angular/common": "^18.2.4",
    "@angular/compiler": "^18.2.4",
    "@angular/core": "^18.2.4",
    "@angular/forms": "^18.2.4",
    "@angular/localize": "^18.2.7",
    "@angular/platform-browser": "^18.2.4",
    "@angular/platform-browser-dynamic": "^18.2.4",
    "@angular/router": "^18.2.4",
    "@babylonjs/core": "^7.29.0",
    "@babylonjs/inspector": "7.29.0",
    "@babylonjs/loaders": "7.29.0",
    "@babylonjs/materials": "^7.29.0",
    "@babylonjs/serializers": "7.29.0",
    ...
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^18.2.4",
    "@angular-eslint/builder": "^18.3.1",
    "@angular-eslint/eslint-plugin": "^18.3.1",
    "@angular-eslint/eslint-plugin-template": "^18.3.1",
    "@angular-eslint/schematics": "^18.3.1",
    "@angular-eslint/template-parser": "18.3.1",
    "@angular/cli": "^18.2.4",
    "@angular/compiler-cli": "^18.2.4",
    "typescript": "~5.4.5",
    ...
  }
}

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "strict": true,
    "noImplicitOverride": true,
    "noPropertyAccessFromIndexSignature": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "skipLibCheck": false,
    "isolatedModules": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "moduleResolution": "bundler",
    "importHelpers": true,
    "target": "ES2022",
    "module": "ES2022"
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}

Errors Encountered:

✘ [ERROR] TS2315: Type 'ArrayBufferView' is not generic. [plugin angular-compiler]
    node_modules/@babylonjs/core/Engines/engine.d.ts:473:135:
      473 │ ...rayBufferView): Promise<ArrayBufferView<ArrayBufferLike>> | null;
          ╵                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
✘ [ERROR] TS2315: Type 'Uint8Array' is not generic. [plugin angular-compiler]
    node_modules/@babylonjs/core/Meshes/GaussianSplatting/gaussianSplattingMesh.d.ts:306:12:
      306 │         sh: Uint8Array<ArrayBuffer>[] | null;
          ╵             ~~~~~~~~~~~~~~~~~~~~~~~
✘ [ERROR] TS2315: Type 'Float32Array' is not generic. [plugin angular-compiler]
    node_modules/@babylonjs/core/Meshes/mesh.d.ts:341:38:
      341 │     get worldMatrixInstancedBuffer(): Float32Array<ArrayBufferLike>;
          ╵                                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

(And many similar errors)

Solution:

Keep "skipLibCheck": true in tsconfig.json.

I hope this helps others facing the same issue! :blush:

1 Like
9

That’s exactly it! I saw your message a little too late. A huge thank you!

10

FYI, it looks like Angular did upgrade TypeScript from 5.6 → 5.7 in November 2024, followed by another upgrade to 5.7.3 just a couple weeks ago :slight_smile: build: update dependency typescript to v5.7.3 (#59512) · angular/angular@9ae0d3e · GitHub

11

There is also a solution on our end - Explicitly set return type to avoid generics by RaananW · Pull Request #16129 · BabylonJS/Babylon.js · GitHub . If we define the types explicitly, they will not be added as generic types to the d.ts files. So after this is merged you should be good without the skipLibCheck flag

5 Likes