How do I show code generated by a loader in a code block?

[JeanJPNM]

Hello, I have a loader that parses typescript declaration of the project and returns some metadata about them in json form.
I would like to show that data in a highlighted code block, but interpolation does not seem to work there, is there any way to do this?

meta.data.ts

import { defineLoader } from "vitepress";
import { parse } from "@babel/parser";
import * as es from "@babel/types";
import { readFile } from "fs/promises";

export default defineLoader({
  watch: "@/../../compiler/lib/commands.d.ts",
  async load(watchedFiles) {
    if (watchedFiles.length == 0)
      throw new Error("No compiler/lib/commands.d.ts file detected");

    const fileContent = await readFile(watchedFiles[0], {
      encoding: "utf8",
    });
    const result = parse(fileContent, {
      plugins: ["typescript"],
      sourceType: "module",
    });

    if (result.errors.length > 0) {
      throw new Error(
        `Error parsing commands declaration file: ${result.errors[0]}`,
        { cause: result.errors[0] },
      );
    }

    return computeMetada(result);
  },
});

doc.md

<script setup>
  import { data } from '../examples/commands.data.ts'
</script>

# Internal metadata

```json
{{ data }}
```

[GordonSmith]

I would like to do something similar as well!

[brc-dd]

Do something like this - #2921 (comment)

return md.render(`\`\`\`json\n${data}\n\`\`\``)