Installation

Créez un site en une commande, ou ajoutez ZenithDocs à un projet Astro.

Sur cette page

ZenithDocs demande Astro 7 et Node.js 22.18 ou plus récent. Il n’est pas publié sur le registre npm : il s’installe directement depuis son dépôt GitHub, ce qui demande Git sur votre machine.

Créer un site

Une commande crée un projet prêt à lancer :

npm

npx github:AymericChaverot/zenith-docs create my-docs

pnpm

pnpm dlx --allow-build=esbuild github:AymericChaverot/zenith-docs create my-docs

C’est la même commande zenith que celle utilisée ensuite dans le projet, lancée directement depuis GitHub. Le premier lancement télécharge ZenithDocs et Astro, ce qui peut prendre une minute ; les suivants passent par le cache.

Dans un terminal, la commande demande le dossier, le titre, le gabarit (cli ou astro), un thème, s’il faut ajouter un Dockerfile et installer les dépendances. Chaque réponse a son option, pour les scripts : --template, --title, --theme, --docker et --install, et --yes accepte les valeurs par défaut.

Ajouter à un projet Astro

Installer le paquet

npm

npm install github:AymericChaverot/zenith-docs

pnpm

pnpm add github:AymericChaverot/zenith-docs

Cela suit la branche main. Ajoutez un tag de version pour la figer, comme github:AymericChaverot/zenith-docs#v0.2.1 : les sites créés par create sont figés ainsi dès le départ.

Ajouter l’intégration

Déclarez ZenithDocs dans votre configuration Astro et donnez un titre à votre site.

astro.config.mjs

import { defineConfig } from 'astro/config';
import zenith from 'zenith-docs';

export default defineConfig({
  integrations: [
    zenith({ title: 'Ma documentation' }),
  ],
});

Déclarer les collections de contenu

ZenithDocs lit les pages dans une collection docs et les métadonnées de navigation dans une collection meta.

src/content.config.ts

import { defineCollection } from 'astro:content';
import { docsLoader, docsSchema, metaLoader, metaSchema } from 'zenith-docs/content';

export const collections = {
  docs: defineCollection({ loader: docsLoader(), schema: docsSchema() }),
  meta: defineCollection({ loader: metaLoader(), schema: metaSchema() }),
};

Écrire votre première page

src/content/docs/index.mdx

---
title: Bienvenue
description: La première page de ma documentation.
---

Bonjour tout le monde !

Lancez astro dev et ouvrez le site : votre page est servie à la racine, avec la sidebar, le sommaire et le thème sombre déjà en place.