addDts

Danger

This has been removed, Bump your Astro peer dependency to ^4.14.0 and use injectTypes():

"astro:config:setup": (params) => {
    addDts(params, {
        name: "my-integration",
        content: `declare module "virtual:my-integration" {}`
    })
},
"astro:config:done": (params) => {
    params.injectTypes({
        filename: "types.d.ts",
        content: `declare module "virtual:my-integration" {}`
    })
}

addDts allows you to inject a .d.ts file into the user’s project. It will create a file inside .astro and reference it from src/env.d.ts. For example:

my-integration/index.ts

import {
    defineIntegration,
    addDts
} from "astro-integration-kit";

export default defineIntegration({
    // ...
    setup() {
        return {
            hooks: {
                "astro:config:setup": (params) => {
                    addDts(params, {
                        name: "my-integration",
                        content: `declare module "virtual:my-integration" {}`
                    })
                }
            }
        }
    }
})

Tip

Don’t worry about indentation or making your code pretty by hand! addDts will do it for you.

How to generate content?

Here are a few suggestions regarding how to deal with content conveniently.

Static content

If content is a static string and you want to have a nice DX instead of managing it inside a string, we recommend you use a stub approach:

my-integration/stubs/virtual-import.d.ts

declare module "virtual:my-integration" {}

my-integration/index.ts

import { defineIntegration, createResolver, addDts } from "astro-integration-kit";
import { readFileSync } from "node:fs";

export default defineIntegration({
    // ...
    setup() {
        const { resolve } = createResolver(import.meta.url)

        return {
            hooks: {
                "astro:config:setup": (params) => {
                    addDts(params, {
                        name: "my-integration",
                        content: readFileSync(resolve("./stubs/virtual-import.d.ts"), "utf-8")
                    })
                }
            }
        }
    }
})

Dynamic content

If you want to generate type from user data/input (codegen), you can go for interpolation or a buffer approach.

Interpolation

my-integration/index.ts

import { defineIntegration, addDts } from "astro-integration-kit";
import { z } from "astro/zod"

export default defineIntegration({
    // ...
    optionsSchema: z.object({ locales: z.array(z.string()) }),
    setup({ options }) {
        return {
            hooks: {
                "astro:config:setup": (params) => {
                    addDts(params, {
                        name: "my-integration",
                        content: `declare module "virtual:my-integration" {
                            export type Locale: ${options.locales.map(e => `"${e}"`).join(" | ")};
                        }`
                    })
                }
            }
        }
    }
})

Buffer

my-integration/index.ts

import { defineIntegration, addDts } from "astro-integration-kit";
import { z } from "astro/zod"

export default defineIntegration({
    // ...
    optionsSchema: z.object({ locales: z.array(z.string()) }),
    setup({ options }) {
        return {
            hooks: {
                "astro:config:setup": (params) => {
                    let content = `declare module "virtual:my-integration" {
                        export type Locale:`
                    for (const locale of locales) {
                        content += ` | ${locale}`
                    }
                    content += ";\n}"

                    addDts(params, {
                        name: "my-integration",
                        content
                    })
                }
            }
        }
    }
})