Skip to content
Astro Integration Kit

addVirtualImports

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

my-integration/index.ts
import {
    defineIntegration,
    addVirtualImports
} from "astro-integration-kit";


export default defineIntegration({
    // ...
    setup({ name }) {
        return {
            hooks: {
                "astro:config:setup": (params) => {
                    addVirtualImports(params, {
                        name,
                        imports: {
                            'virtual:my-integration/config': `export default ${JSON.stringify({ foo: "bar" })}`,
                        }
                    })


                    addVirtualImports(params, {
                        name,
                        imports: [
                            {
                                id: "virtual:my-integration/advanced",
                                content: "export const foo = 'server'",
                                context: "server"
                            },
                            {
                                id: "virtual:my-integration/advanced",
                                content: "export const foo = 'client'",
                                context: "client"
                            },
                        ]
                    })
                }
            }
        }
    }
})

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

my-integration/src/pages/index.astro
---
import config from "virtual:my-integration/config",


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

Typing your virtual module

Section titled “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:

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