Livemark, générateur de sites Markdown sans limites

Introduction

Livemark est un générateur de sites Markdown. Indiquez-lui les fichiers Markdown de votre projet et il vous donne un site de documentation rapide, avec recherche, coloration syntaxique, diagrammes et formules, mode sombre, et des sections documentation, blog et changelog intégrées. Il a belle allure sans aucune configuration. Quand il vous faut davantage, rien n’est verrouillé : n’importe quel composant, style ou route peut être remplacé par votre propre code React, Tailwind et TanStack Start, sans forker le paquet.

Pourquoi un outil de documentation de plus

Les outils de documentation se situent souvent à l’une de deux extrémités. Certains démarrent vite et se plient mal : vous recevez le thème, et le jour où il vous faut une page que le thème n’avait pas prévue, vous vous battez contre lui. D’autres sont des frameworks que vous assemblez vous-même, si bien que vous maintenez une application avant d’avoir écrit un paragraphe.

Livemark part de la première extrémité et vous laisse rejoindre la seconde, un fichier à la fois. Un nouveau projet, c’est un fichier de configuration et un dossier de Markdown. Plus tard, livemark escape copie n’importe quel composant, feuille de styles ou route intégrés dans un dossier .livemark/, où votre copie prend le pas sur la version par défaut. Vous ne possédez que les fichiers que vous avez modifiés, et le reste continue d’être mis à jour avec le paquet.

Ce que vous obtenez

• Écrivez simplement du Markdown — du Markdown façon GitHub avec frontmatter, notes de bas de page, inclusions et identifiants de titres personnalisés ; MDX est là quand une page a besoin d’un composant
• Des pages venues de partout — les globs include et exclude choisissent les fichiers, donc la documentation vit à côté du code, et un CONTRIBUTING.md ou un CHANGELOG.md que vous tenez déjà rejoint le site
• Blocs de code — coloration Shiki dans un thème clair et un thème sombre à la fois, avec titres, surlignage de lignes et de mots, diffs, lignes mises en avant et indications de types TwoSlash
• Diagrammes et formules — des diagrammes Mermaid et des équations LaTeX qui suivent le thème
• Éléments riches — encadrés, onglets, étapes, cartes, badges, boutons, arborescences de fichiers, colonnes et onglets de gestionnaires de paquets, en directives Markdown ou en composants MDX
• Documentation, blog et changelog — des sections avec leur propre navigation : un blog avec tags et flux RSS, et un changelog généré depuis un CHANGELOG.md ou depuis les releases GitHub
• Recherche — une recherche plein texte qui s’exécute dans le navigateur, avec les correspondances surlignées sur la page d’arrivée
• Multilingue — des traductions à côté de leurs originaux, un sélecteur de langue et une interface traduite
• Personnalisable — des tokens Tailwind v4 pour le thème, et chaque composant, style et route peut être extrait et remplacé fichier par fichier
• Conçu pour les agents — chaque build publie un jumeau Markdown de chaque page, llms.txt et vos agent skills, et chaque commande parle JSON
• Construit sur TanStack Start — des pages prérendues, un sitemap et un routage côté client, dans un build statique que n’importe quel hébergeur peut servir

Un site

Un site, c’est un fichier de configuration. Il définit le titre et indique où se trouvent les pages :

import { defineConfig } from "livemark"

export default defineConfig({
  title: "My docs",
  description: "Documentation for my project",
  include: ["docs/**/*.md"],
})

Une page est un fichier Markdown dont le frontmatter porte le titre, la description et l’ordre :

---
title: Getting Started
description: Set up the project in five minutes.
order: 1
---

# Getting Started

Welcome!

L’essayer

Livemark demande Node.js 24 ou plus récent et s’installe depuis npm :

npm install livemark

Ensuite, toute la boucle tient en quatre commandes :

npx livemark start    # serveur de développement avec HMR sur http://localhost:8000
npx livemark build    # build de production dans .livemark/build/
npx livemark preview  # sert le build de production en local
npx livemark clear    # supprime les fichiers générés

Le build est un dossier de fichiers statiques. La documentation propose des guides pour Cloudflare, GitHub Pages, Vercel, Netlify et tout autre hébergeur statique.

Dans votre propre application

Le pipeline Markdown de Livemark et ses composants sont aussi distribués séparément, sous le nom @livemark/vite. Toute application React construite avec Vite peut importer un fichier .md et le rendre avec les mêmes encadrés, onglets et blocs de code, et une collection liste un dossier d’articles sans charger leur contenu. Ce blog est rendu avec lui.

Agent skills

Livemark est livré avec cinq Agent Skills qui apprennent aux agents de code tels que Claude Code, Cursor et Codex comment fonctionne un projet : écrire des articles, les options de configuration, personnaliser l’interface, concevoir une landing page et déployer. Une fois installées, vous n’avez plus à expliquer tout cela dans le prompt.

Et ensuite

Livemark est open source, sous licence MIT. Il est sur npm depuis mai 2025, avec plus de 80 versions publiées, et sa propre documentation sur livemark.dev est construite avec lui. Essayez-le, ouvrez une issue avec vos retours et donnez-lui une étoile sur GitHub pour aider le projet à grandir — https://github.com/datisthq/livemark