loading...

Solving Typescript-TensorflowJS incompat issues

dkp1903 profile image Dushyant Pathak ・1 min read

If you're trying to use Tensorflow.js with Angular, which uses Typescript, you might run into an error that looks something like this.

node_modules/@types/webgl2/index.d.ts:582:13 - error TS2403: Subsequent variable declarations must have the same type.  Variable 'WebGL2RenderingContext' must be of type '{ new (): WebGL2RenderingContext; prototype: WebGL2RenderingContext; readonly ACTIVE_ATTRIBUTES: number; readonly ACTIVE_TEXTURE: number; readonly ACTIVE_UNIFORMS: number; readonly ALIASED_LINE_WIDTH_RANGE: number; ... 554 more ...; readonly WAIT_FAILED: number; }', but here has type '{ new (): WebGL2RenderingContext; prototype: WebGL2RenderingContext; readonly ACTIVE_ATTRIBUTES: number; readonly ACTIVE_TEXTURE: number; readonly ACTIVE_UNIFORMS: number; readonly ALIASED_LINE_WIDTH_RANGE: number; ... 555 more ...; readonly MAX_CLIENT_WAIT_TIMEOUT_WEBGL: number; }'.

582 declare var WebGL2RenderingContext: {
                ~~~~~~~~~~~~~~~~~~~~~~

  node_modules/typescript/lib/lib.dom.d.ts:16450:13
    16450 declare var WebGL2RenderingContext: {
                      ~~~~~~~~~~~~~~~~~~~~~~
Enter fullscreen mode Exit fullscreen mode

This is a compatibility issue between the existing version of WebGL2(0.0.4) and Typescript 3.6.

To solve this, just type

npm i --save @types/webgl2
Enter fullscreen mode Exit fullscreen mode

and rerun the application.

TF.js should now work without a glitch.

Cheers! Happy coding

Discussion

pic
Editor guide
Collapse
juliettet profile image
Juliette

Thank you Dushyant!!