How I fixed some trouble importing types in .d.ts files
I had some trouble making something work in my Astro site.
I used Astro locals and I had to type a variable I shared using locals.
So I went and added that to the src/env.d.ts
, as the docs say.
But my types weren’t picked up.
My code looked like this:
/// <reference types="astro/client" />
import { sometype } from 'somelib'
declare namespace App {
interface Locals {
somevariable: sometype
}
}
What I discovered thanks to this SO answer is, we can’t do imports like this in .d.ts
files.
So I imported the type in another file, and then I imported the type from that file, like this:
typesforenvdts.ts
import { sometype } from 'somelib'
export { sometype }
env.d.ts
/// <reference types="astro/client" />
declare namespace App {
interface Locals {
somevariable: import('./typesforenvdts').sometype
}
}
Don’t ask me why, but now it works.
I wrote 21 books to help you become a better developer:
- HTML Handbook
- Next.js Pages Router Handbook
- Alpine.js Handbook
- HTMX Handbook
- TypeScript Handbook
- React Handbook
- SQL Handbook
- Git Cheat Sheet
- Laravel Handbook
- Express Handbook
- Swift Handbook
- Go Handbook
- PHP Handbook
- Python Handbook
- Linux Commands Handbook
- C Handbook
- JavaScript Handbook
- Svelte Handbook
- CSS Handbook
- Node.js Handbook
- Vue Handbook
Also, JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025