Vite + Rollup production build "TS2304: Cannot find name 'WebGLObject'"

Questions
1

I’m in the process of trying out Vite (+ Rollup) for current projects.

It’s working great for local dev but when building for production (Vite uses Rollup for prod builds) I get the following errors:

node_modules/@babylonjs/core/Engines/engine.d.ts:1086:30 - error TS2304: Cannot find name 'WebGLObject'.
1086 interface WebGLQuery extends WebGLObject {

node_modules/@babylonjs/core/Engines/engine.d.ts:1094:32 - error TS2304: Cannot find name 'WebGLObject'.
1094 interface WebGLSampler extends WebGLObject {

node_modules/@babylonjs/core/Engines/engine.d.ts:1102:29 - error TS2304: Cannot find name 'WebGLObject'.
1102 interface WebGLSync extends WebGLObject {

node_modules/@babylonjs/core/Engines/engine.d.ts:1110:42 - error TS2304: Cannot find name 'WebGLObject'.
1110 interface WebGLTransformFeedback extends WebGLObject {

node_modules/@babylonjs/core/Engines/engine.d.ts:1118:42 - error TS2304: Cannot find name 'WebGLObject'.
1118 interface WebGLVertexArrayObject extends WebGLObject {

So far I haven’t been able to find much about it except maybe this: Opaque types for WebGL · Issue #5855 · microsoft/TypeScript · GitHub

Anyone have any ideas?

2

WebGLObject seems to be missing from lib.dom.d.ts

After installing webgl-strict-types the production build works.

But I’m still a little clueless why the issue … and whether my solution is OK?

3

WebGLObject has been removed from TS 4.3.2.

@Deltakosh has updated Babylon.js sources to remove references to this object, I think it was last week. You may not have the latest sources?

2 Likes
4

They are so annoying with those changes :frowning:

3 Likes
5

Thanks @Evgeni_Popov . I updated from Babylon.js 4.2.0 to latest preview 5.0.0-alpha.24, removed my webgl-strict-types dependency and now the production build works fine.

6

This change should be propagated to a new version 4.2.1 if it is not a breaking change.

2 Likes
7

Don’t wanna necro the thread but only just came back to Babylon after few months and while updating project dependencies earlier today came across above error.

I want latest Typescript and I want BabylonJS@4.2 but so here is my work around the issue using global type declaration files.

Looking at TypeScript@v4.0.8 source code …

WebGLObject is a very simple interface, so error can be easily avoided by adding highlighted code into type definition files like globals.d.ts (or babylon.d.ts if you have one in your types folder :wink: ). Once BabylonJS@5.0 is out remove the snippet and you will be good to go.

Make sure to have typeRoots prop configured in your tsconfig.json to something like…

{
  "typeRoots": ["node_modules/@types", "src/@types"],
}

Hope it helps.

2 Likes