TypeScript 5.0 errors

Bugs
1

Hello, i just started a new project and wanted to use the latest TypeScript 5.0 version. Sadly it does not work with BabylonJS 5.53.0 because of errors like this:

node_modules/@babylonjs/core/Engines/engine.d.ts:3312:14 - error TS2717: Subsequent property declarations must have the same type.  Property 'FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR' must be of type '38448', but here has type 'number'.

3312     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR: number;
                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  node_modules/typescript/lib/lib.dom.d.ts:10509:14
    10509     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR: 0x9630;
                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    'FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR' was also declared here.

I know that there are workarounds but it would be nice if it would work out of the box. Are there any plans to support TypeScript 5.0 directly?

2

Yes, it is planned, although it is not the current priority due to the launch of version 6.0, but it will probably come a little later.

3

Hi, I have the same error but with Typescript 4.9.5 and BabylonJS 6.0. I checked the installed packages.

BabylonJS 5.57.1 works fine for me, but as soon as I try 6.0.0 I get the same problem as @Kesshi .
Maybe it is also a question of tsconfig?

{
  "compileOnSave": false,
  "compilerOptions": {
    "allowJs": true,
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitOverride": true,
    "noPropertyAccessFromIndexSignature": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "ES2022",
    "module": "es2020",
    "lib": [
      "es2020",
      "dom"
    ],
    "useDefineForClassFields": false
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}
4

cc @RaananW

5

I can only assume you have the exact opposite error?

This was fixed for 6.0.0, as the newest lib.dom.d.ts has the definitions of those variables.
Can you share your project so I can find a solution that will work with all versions?

6

With Babylonjs 6.0.0 and Typescript 4.9.5 I’ve got the following errors:

 ERROR(TypeScript)  Subsequent property declarations must have the same type.  Property 'FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR' must be of type 'number', but here has type '38448'.
 FILE  node_modules/@babylonjs/core/Engines/engine.d.ts:3371:14

    3369 | interface OVR_multiview2 {
    3370 |     framebufferTextureMultiviewOVR(target: GLenum, attachment: GLenum, texture: WebGLTexture | null, level: GLint, baseViewIndex: GLint, numViews: GLsizei): void;
  > 3371 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR: 0x9630;
         |              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3372 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR: 0x9632;
    3373 |     readonly MAX_VIEWS_OVR: 0x9631;
    3374 |     readonly FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR: 0x9633;

 ERROR(TypeScript)  Subsequent property declarations must have the same type.  Property 'FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR' must be of type 'number', but here has type '38450'.
 FILE  node_modules/@babylonjs/core/Engines/engine.d.ts:3372:14

    3370 |     framebufferTextureMultiviewOVR(target: GLenum, attachment: GLenum, texture: WebGLTexture | null, level: GLint, baseViewIndex: GLint, numViews: GLsizei): void;
    3371 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR: 0x9630;
  > 3372 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR: 0x9632;
         |              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3373 |     readonly MAX_VIEWS_OVR: 0x9631;
    3374 |     readonly FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR: 0x9633;
    3375 | }

 ERROR(TypeScript)  Subsequent property declarations must have the same type.  Property 'MAX_VIEWS_OVR' must be of type 'number', but here has type '38449'.
 FILE  node_modules/@babylonjs/core/Engines/engine.d.ts:3373:14

    3371 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_NUM_VIEWS_OVR: 0x9630;
    3372 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR: 0x9632;
  > 3373 |     readonly MAX_VIEWS_OVR: 0x9631;
         |              ^^^^^^^^^^^^^
    3374 |     readonly FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR: 0x9633;
    3375 | }
    3376 |

 ERROR(TypeScript)  Subsequent property declarations must have the same type.  Property 'FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR' must be of type 'number', but here has type '38451'.
 FILE  node_modules/@babylonjs/core/Engines/engine.d.ts:3374:14

    3372 |     readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_BASE_VIEW_INDEX_OVR: 0x9632;
    3373 |     readonly MAX_VIEWS_OVR: 0x9631;
  > 3374 |     readonly FRAMEBUFFER_INCOMPLETE_VIEW_TARGETS_OVR: 0x9633;
         |              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3375 | }
    3376 |
    3377 | abstract class OVR_multiview2 implements OVR_multiview2 {}
7

Yes, this is the other way from the typescript 5.0.0 error.
Breaking changes in TS 5’s lib.dom.d.ts cause this. i’ll run a few experiments and will find a solution. Thanks for reporting.

8

BTW - I can only assume that adsding skipLibCheck: true to your tsconfig will allow you to compile without an issue.

1 Like
9

Maybe not necessary anymore, but I created a basic project to reproduce the error: GitHub - MasonVX/babylonjs6WithTypescirpt4.

10

Yes, setting skipLibCheck to true removes the error.

1 Like
11

Typescript also supports to specify which version of the lib.dom should be used. See: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-5.html#supporting-lib-from-node_modules
In my case (TS 5.0 with BabylonJS 5.53.0) i added this line in the dependecies to solve the problem: "@typescript/lib-dom": "npm:@types/web@0.0.84":
Here is also an (outdated) list of versions: GitHub - microsoft/TypeScript-DOM-lib-generator: Tool for generating dom related TypeScript and JavaScript library files

So in your case this could work (without skipLibCheck: true): "@typescript/lib-dom": "npm:@types/web@0.0.99"

12

I just tried Version 6 with TS 5 but it still does not work. I get this error:

node_modules/typescript/lib/lib.dom.d.ts:14990:11 - error TS2430: Interface 'WebGL2RenderingContext' incorrectly extends interface 'WebGL2RenderingContextBase'.
  Types of property 'MIN' are incompatible.
    Type 'number' is not assignable to type '32775'.

14990 interface WebGL2RenderingContext extends WebGL2RenderingContextBase, WebGL2RenderingContextOverloads, WebGLRenderingContextBase {
                ~~~~~~~~~~~~~~~~~~~~~~

The problem is here i think: Babylon.js/webgl2.d.ts at master · BabylonJS/Babylon.js · GitHub
MIN is defined as number but in the lib-dom its defined as 0x8007.

1 Like
13

i’ll fix that asap.

Thanks

14

That’s right. But still - people are expecting that to work out of the box, and I can understand them.
To be honest, I think the best solution would be to remove those duplicated declaration, as typescript now supports them.

I will suggest a draft PR with a fix that will work for both typescript versions (hopefully :wink: ).

Thanks again for following up on this.

2 Likes
15

Version 6.1.0 solves my issues. :smile:

2 Likes
16

The new version was pushed yesterday, with the PR fixing it merged. I am glad everything works as expected now. If anyone has any issue still, please let me know!

3 Likes