javascript - Er det mulig å gjengi TS-typer eller verdier av variabler inne i markdown-filer ved bruk av statiske nettstedgeneratorer som VitePress?

Jeg vil lage en dokumentasjon ved hjelp av Vitepress (eller lignende). Denne appen bruker en pakke som inneholder typer og Zod-skjemaer. Rotbibliotekets index.ts kunne være

import { z } from 'zod';

const userSchema = z
  .object({
    username: z.string().min(1),
  })
  .strict();

type User = z.infer<typeof userSchema>;

export { userSchema, type User }

Finnes det en måte å enten gjengi skjemaet eller typen inne i markdown-filen på?

Kanskje med hjelp av Vue-filer (VitePress)

Jeg vil bare beskrive skjemaet eller typen, men vil ikke kopiere alle feltene fra det fordi da må jeg passe på at alt er synkronisert.

Svar #1

  1. Bruk https://www.npmjs.com/package/zod-to-ts for å konvertere skjemaet ditt til en Runtime TypeScript-streng
  2. Bruk ts-vue Code Blocks for å gjengi det
<script setup lang="ts">
import { printNode, zodToTs } from 'zod-to-ts'
import { UserSchema } from './schemas'

const identifier = 'User'
const { node } = zodToTs(UserSchema, identifier)
const nodeString = printNode(node)
</script>

```ts-vue
// {{ identifier }} Schema
{{ nodeString }}
```

Relaterte artikler