deck.gl and Angular

[ccreed1988]

Hello,

My team and I want to use deck.gl in our Angular project. I started by following this tutorial: https://deck.gl/docs/get-started/using-standalone

The first step I did was install deck.gl: npm install @deck.gl/core @deck.gl/layers

This installed versions 9.0.27 for both core and layers. Those libraries are also using version 9.0.25 of @luma.gl/core

After I did that I tried importing the libraries into my Typescript code. All I did was the following:

import {Deck, MapViewState} from '@deck.gl/core'; import {ScatterplotLayer} from '@deck.gl/layers';

When I try to compile the typescript with Angular (by doing ng build) it gives me the following errors (see below):

I feel like something is wrong with the libraries right out of the box. All I did was import the libraries - so shouldn't it at least have compiled? I am unsure if there is something wrong with my set up but to me it feels like there is a bug in the luma library. Or at least it is using the wrong version of luma.

Should I make a bug for this? What does everyone think?

`Compiling with Angular sources in Ivy partial compilation mode.
node_modules/@luma.gl/core/dist/adapter/resources/resource.d.ts:51:39 - error TS2344: Type 'unknown' does not satisfy the constraint 'ResourceProps'.

51 attachResource(resource: Resource): void;
~~~~~~~
node_modules/@luma.gl/core/dist/adapter/resources/resource.d.ts:55:39 - error TS2344: Type 'unknown' does not satisfy the constraint 'ResourceProps'.

55 detachResource(resource: Resource): void;
~~~~~~~
node_modules/@luma.gl/core/dist/adapter/resources/resource.d.ts:59:48 - error TS2344: Type 'unknown' does not satisfy the constraint 'ResourceProps'.

59 destroyAttachedResource(resource: Resource): void;
~~~~~~~
node_modules/@deck.gl/core/dist/shaderlib/picking/picking.d.ts:25:136 - error TS2694: Namespace '"/Users/christopherreed/Documents/Repositories/drg-libraries/drg-map/projects/drg-map/node_modules/@luma.gl/shadertools/dist/lib/shader-module/shader-module"' has no exported member 'UniformValue'.

25 getUniforms?: ((props?: any, oldProps?: any) => Record<string, import("@luma.gl/shadertools/dist/lib/shader-module/shader-module").UniformValue>) | undefined;
~~~~~~~~~~~~
node_modules/@luma.gl/engine/dist/shader-inputs.d.ts:16:49 - error TS2344: Type 'ShaderPropsT[P]' does not satisfy the constraint 'Record<string, any>'.
Type 'ShaderPropsT[keyof ShaderPropsT]' is not assignable to type 'Record<string, any>'.
Type 'ShaderPropsT[string] | ShaderPropsT[number] | ShaderPropsT[symbol]' is not assignable to type 'Record<string, any>'.
Type 'ShaderPropsT[string]' is not assignable to type 'Record<string, any>'.
Type 'Record<string, unknown> | undefined' is not assignable to type 'Record<string, any>'.
Type 'undefined' is not assignable to type 'Record<string, any>'.

16 [P in keyof ShaderPropsT]: ShaderModule<ShaderPropsT[P]>;
~~~~~~~~~~~~~~~
node_modules/@luma.gl/engine/dist/shader-inputs.d.ts:29:50 - error TS2344: Type 'ShaderPropsT[P]' does not satisfy the constraint 'Record<string, any>'.
Type 'ShaderPropsT[keyof ShaderPropsT]' is not assignable to type 'Record<string, any>'.

29 [P in keyof ShaderPropsT]?: ShaderModule<ShaderPropsT[P], any>;`

[ibgreen]

@ccreed1988 Thanks for reporting. I have not seen these issues, that doesn't mean that they don't exist. Maybe there is a new release of typescript that you are using that is more strict? Or something in our current setup hides these errors.

[ccreed1988]

Hi

Sorry for the late reply.

I looked into this a bit more and I was able to resolve some of the errors by setting strict to false instead of true in the tsconfig.json for the typescript compiler.

However the one issue I cannot resolve is this (see below). I looked through the code and I think it is actually looking in the wrong spot. I was able to get it working when I changed

this path: @luma.gl/shadertools/dist/lib/shader-module/shader-module

to this path: @luma.gl/shadertools/dist/lib/utils/uniform-types

I think this is a bug. Should I make a pull request for a fix? Can you verify the location of the files I am talking about?

Thanks!

node_modules/@deck.gl/core/dist/shaderlib/picking/picking.d.ts:25:136 - error TS2694: Namespace '"/Users/christopherreed/Documents/Repositories/drg-libraries/drg-map/projects/drg-map/node_modules/@luma.gl/shadertools/dist/lib/shader-module/shader-module"' has no exported member 'UniformValue'.

25 getUniforms?: ((props?: any, oldProps?: any) => Record<string, import("@luma.gl/shadertools/dist/lib/shader-module/shader-module").UniformValue>) | undefined;