Aller au contenu

Installation

Choisissez le package chargé de générer votre HTML. En cas de doute, comparez d’abord Astro, Svelte et Core.

  • Node.js 22.12 ou supérieur
  • Zod 4 (peer dependency)
  • Pour Astro : Astro 5, 6 ou 7
  • Pour Svelte : Svelte 5 (avec support des runes) ou SvelteKit 2

Le package @unschema-graph/astro inclut l’intégration Astro, le composant <Schema />, l’inspecteur Dev Toolbar et les helpers de collections de contenu.

Option A : Configuration automatique (Recommandée)

Section intitulée « Option A : Configuration automatique (Recommandée) »

Utilisez la CLI officielle d’Astro pour installer et configurer l’intégration en une seule commande :

Fenêtre de terminal
npx astro add @unschema-graph/astro

Installez le package et ses dépendances :

pnpm

Fenêtre de terminal
pnpm add @unschema-graph/astro zod

npm

Fenêtre de terminal
npm install @unschema-graph/astro zod

yarn

Fenêtre de terminal
yarn add @unschema-graph/astro zod

bun

Fenêtre de terminal
bun add @unschema-graph/astro zod

Ajoutez schemaGraph() dans votre fichier astro.config.mjs :

astro.config.mjs
import { defineConfig } from 'astro/config';
import { schemaGraph } from '@unschema-graph/astro';
export default defineConfig({
site: 'https://mon-site.fr',
integrations: [schemaGraph()],
});

Le package @unschema-graph/svelte inclut le composant natif Svelte 5 <Schema /> et réexporte le catalogue complet des builders du Core.

pnpm

Fenêtre de terminal
pnpm add @unschema-graph/svelte zod

npm

Fenêtre de terminal
npm install @unschema-graph/svelte zod

yarn

Fenêtre de terminal
yarn add @unschema-graph/svelte zod

bun

Fenêtre de terminal
bun add @unschema-graph/svelte zod

Aucun plugin de build ni configuration Vite n’est requis ! Importez directement vos composants et builders dans vos fichiers .svelte.


Pour les scripts Node.js, Nitro, Fastify, Next.js, Remix ou les pipelines de build :

pnpm

Fenêtre de terminal
pnpm add @unschema-graph/core zod

npm

Fenêtre de terminal
npm install @unschema-graph/core zod

yarn

Fenêtre de terminal
yarn add @unschema-graph/core zod

bun

Fenêtre de terminal
bun add @unschema-graph/core zod

Package / Import Description
@unschema-graph/astro Intégration Astro, composant <Schema />, catalogue complet des builders et utilitaires
@unschema-graph/astro/content Helpers de mapping pour les collections Astro (toArticle, toBlogPosting, toNewsArticle) (également réexportés depuis @unschema-graph/astro)
@unschema-graph/svelte Composant natif Svelte 5 <Schema /> avec réexport complet de tous les builders
@unschema-graph/core Moteur TypeScript universel : builders, graphes @graph, sérialisation et durées
@unschema-graph/core/audit Moteur d’audit programmatique du HTML JSON-LD

Continuez avec votre premier schéma dans Astro, Svelte ou Core.