Installation

Install the comark-docs layer from GitHub, extend your Nuxt config, and write your first page.

Prerequisites

  • A Nuxt 4 app in a GitHub repository. Production content is read from GitHub, so the repository must exist there (public or private).
  • Node.js 20 or later.

Install the layer

comark-docs isn't published to npm yet — install it from GitHub:

pnpm add comark-docs@github:comarkdown/comark-docs

This adds a git dependency to your package.json:

package.json
{
  "dependencies": {
    "comark-docs": "github:comarkdown/comark-docs"
  }
}
Your package manager pins the resolved commit in the lockfile, so installs are reproducible. Run pnpm update comark-docs (or the npm equivalent) to move to the latest commit.

Extend your Nuxt config

Add the layer with extends and set your site's URL and name:

nuxt.config.ts
export default defineNuxtConfig({
  extends: ['comark-docs'],
  site: {
    url: 'https://docs.example.com',
    name: 'My Project',
  },
})

The layer brings its own modules (Nuxt UI, Comark, SEO, OG images, MCP, and more) — you don't need to install or register anything else.

Write your first pages

Create a content/ directory at the app root. Numeric prefixes order sections and pages; they're stripped from URLs:

content/
├── index.md                     → /
└── 1.getting-started/
    ├── .navigation.yml
    └── 1.introduction.md        → /getting-started/introduction
content/1.getting-started/1.introduction.md
---
title: Introduction
description: What this project does and why it exists.
---

Welcome to the docs!

See Writing pages for the full structure, frontmatter, and navigation conventions.

Run it

Terminal
nuxt dev

In development, content is read from your working tree with hot reload. Edit a Markdown file and the page updates immediately.

Diagrams

Mermaid diagrams work out of the box — write a ```mermaid code fence and it renders as a diagram:

Next steps