Cannot find name 'PerformancePaintTiming' in Angular 11

[SA-full-stack-developer]

Hi,

when I installing that and I use

onINP(({ value }) => {
      // Log the value to the console, or send it to your analytics provider.
      console.log(value);
    });

can not compile Angular 11 application, send me that error 
Error: node_modules/web-vitals/dist/modules/types.d.ts:19:14 - error TS2304: Cannot find name 'PerformancePaintTiming'.      

19     'paint': PerformancePaintTiming;

I installing v3 beta version, I want to use onINP function

Thank you

[philipwalton]

The PerformancePaintTiming interface has been included in Typescript for several versions now. I assume that since you're using an older version of Angular, you're fixed to a specific version that does not include this type.

If upgrading Angular isn't an option, I'd recommend maintaining a separate "types" file in your app the includes types for any platform features not included in the version of Typescript that you're using. Once you're able to upgrade Typescript then you can remove the entries in that file.

For example, you can see the type definitions for PerformancePaintTiming here:
https://github.com/microsoft/TypeScript/blob/v4.7.4/lib/lib.dom.d.ts#L10672-L10678

[SA-full-stack-developer]

Thank you very much for explanation, I will try the second option.

[pratapkaran]

Thank you very much for explanation, I will try the second option.

Hi can you please help me. I’m using using angular 11. How to create separate types file??