addVirtualImport

addVirtualImport allows you to create virtual modules and share data from your integration. For example:

Extended hooks
Standalone utilities

import { defineIntegration } from "astro-integration-kit";
import { addVirtualImportPlugin } from "astro-integration-kit/plugins";

export default defineIntegration({
    name: "my-integration",
    plugins: [addVirtualImportPlugin],
    setup() {
        return {
            "astro:config:setup": ({ addVirtualImport }) => {
                addVirtualImport({
                    name: 'virtual:my-integration/config',
                    content: `export default ${JSON.stringify({ foo: "bar" })}`,
                })
            }
        }
    }
})

import type { AstroIntegration } from "astro";
import { addVirtualImport } from "astro-integration-kit/utilities";

export default function myIntegration(): AstroIntegration {
    return {
        name: "my-integration",
        hooks: {
            "astro:config:setup": ({ updateConfig }) => {
                addVirtualImport({
                    name: 'virtual:my-integration/config',
                    content: `export default ${JSON.stringify({ foo: "bar" })}`,
                    updateConfig,
                })
            }
        }
    }
}

You can now access the config somewhere else, for example inside a page injected by your integration:

---
import config from "virtual:my-integration/config",

console.log(config.foo) // "bar"
---

Typing your virtual module

In order to get the types for your virtual modules while developing your integration, you’ll need to manually declare a virtual module.

First create a virtual.d.ts file in your integration root. Then you can define your virtual modules as global TypeScript modules:

declare module "virtual:my-integration/config" {
    export default { foo: string };
}