vicary
vicary•7h ago

[Fresh 2] How to reference DOM types in Islands?

I have a simply click-to-copy button in my islands, but navigator.clipboard fails deno check because it's only referencing Deno's runtime API where clipboard features are not implemented. Is it possible to configure the project in a way that only islands/**/*.tsx includes the DOM API in compilerOptions.lib?
6 Replies
vicary
vicaryOP•7h ago
The project is migrating from Fresh 1 to Fresh 2, this error didn't exist before.
fry69
fry69•7h ago
This might help -> https://fresh.deno.dev/docs/concepts/islands#rendering-islands-on-client-only
Islands | Fresh docs
Islands enable client side interactivity in Fresh. They are hydrated on the client in addition to being rendered on the server.
vicary
vicaryOP•7h ago
This does prevents runtime errors, I want to make it through the type checks in my CI first.
No description
vicary
vicaryOP•7h ago
My current approach is to add the following config in my deno.json but it affects all .tsx files instead of only those in island/. 
{
  "compilerOptions": {
    "lib": [
      "deno.ns", 
      "deno.unstable", 
      "deno.window", 
      "dom", 
      "dom.iterable"
    ]
  }
}
{
  "compilerOptions": {
    "lib": [
      "deno.ns", 
      "deno.unstable", 
      "deno.window", 
      "dom", 
      "dom.iterable"
    ]
  }
}
fry69
fry69•7h ago
Dunno if that makes a difference, but here is the config from one of my projects: 
  "compilerOptions": {
    "lib": ["dom", "dom.asynciterable", "deno.ns", "deno.unstable"],
    "jsx": "precompile",
    "jsxImportSource": "preact",
    "jsxPrecompileSkipElements": [
      "a",
      "img",
      "source",
      "body",
      "html",
      "head",
      "title",
      "meta",
      "script",
      "link",
      "style",
      "base",
      "noscript",
      "template"
    ],
    "types": ["vite/client"]
  },
  "compilerOptions": {
    "lib": ["dom", "dom.asynciterable", "deno.ns", "deno.unstable"],
    "jsx": "precompile",
    "jsxImportSource": "preact",
    "jsxPrecompileSkipElements": [
      "a",
      "img",
      "source",
      "body",
      "html",
      "head",
      "title",
      "meta",
      "script",
      "link",
      "style",
      "base",
      "noscript",
      "template"
    ],
    "types": ["vite/client"]
  },
marvinh.
marvinh.•7h ago
yeah there is currently no way to make types only available for islands. It's either everything or nothing.

Did you find this page helpful?