Home > front end >  How to avoid dom / Deno type conflicts with Typescript SSR
How to avoid dom / Deno type conflicts with Typescript SSR

Time:02-24

I'm trying to set up React SSR using Typescript and Deno based on this guide. The basic setup worked, however when I tried to add the BlueprintJS component library I ran into an issue.

Blueprint depends on Popper which uses some DOM types, e.g. CSSStyleDeclaration. My server.tsx needs to use the Deno object and Popper (because it needs to import { App } from "components/app.tsx";) so theoretically I need my tsconfig.json to contain both Deno and DOM types, like this:

"lib": ["dom", "dom.iterable", "esnext", "deno.ns", "deno.unstable"],

However that doesn't work because they conflict with each other. But I need them both - if I remove either then I'll get missing type errors - either for Deno or for CSSStyleDeclaration.

How can I resolve this without sacrificing type checking?

CodePudding user response:

You can't, and you'll need to separately type-check all modules which use incompatible ambient types, then run your program with type-checking disabled.

The TypeScript compiler (which is what Deno currently uses to compile TS source files) isn't yet capable of handling modules in a single graph which rely on conflicting ambient types.

  • Related