addVirtualImports

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

1
import {
2
    defineIntegration,
3
    addVirtualImports
4
} from "astro-integration-kit";
5

6
export default defineIntegration({
7
    // ...
8
    setup({ name }) {
9
        return {
10
            "astro:config:setup": (params) => {
11
                addVirtualImports(params, {
12
                    name,
13
                    imports: {
14
                        'virtual:my-integration/config': `export default ${JSON.stringify({ foo: "bar" })}`,
15
                    }
16
                })
17

18
                addVirtualImports(params, {
19
                    name,
20
                    imports: [
21
                        {
22
                            id: "virtual:my-integration/advanced",
23
                            content: "export const foo = 'server'",
24
                            context: "server"
25
                        },
26
                        {
27
                            id: "virtual:my-integration/advanced",
28
                            content: "export const foo = 'client'",
29
                            context: "client"
30
                        },
31
                    ]
32
                })
33
            }
34
        }
35
    }
36
})

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

1
---
2
import config from "virtual:my-integration/config",
3

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

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:

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