#env.d.ts with `ImportMetaEnv` and `global` gives problem

4 messages · Page 1 of 1 (latest)

misty current
#

My env.d.ts now contained:

/// <reference types="astro/client" />

interface ImportMetaEnv {
  readonly CURRENT_SEASON: number
}

interface ImportMeta {
  readonly env: ImportMetaEnv
}

as documented here: https://docs.astro.build/en/guides/environment-variables/#intellisense-for-typescript

This works perfectly and the import.meta.env.CURRENT_SEASON resolves perfectly yo a number as expected 💪

But now I needed to extend the global as well and I followed the documentation here:
https://docs.astro.build/en/guides/typescript/#extending-window-and-globalthis

and updated my env.d.ts to:

/// <reference types="astro/client" />

import type * as noUiSlider from 'nouislider'

interface ImportMetaEnv {
  readonly CURRENT_SEASON: number
}

interface ImportMeta {
  readonly env: ImportMetaEnv
}

declare global {
  interface JQuery {
    noUiSlider(): noUiSlider.API
  }
}

export {}

but now import.meta.env.CURRENT_SEASON suddenly becomes of type any 😦
so probably I'm doing something wrong but I don't know what...

Any help appreciated.

Astro Documentation

Learn how to use environment variables in an Astro project.

Astro Documentation

Learn how to use Astro's built-in TypeScript support.

smoky harness
#

Ah yeah, you can't do both in the same file because the export {} makes it a module, which cannot extend global interfaces

misty current
#

so better to create a separate global.d.ts file then?

smoky harness
#

Yeah, that should work!