• Nimiq Frankenstein

Installation ​

Package Installation ​

Install the Nimiq VitePress theme in your project:

bash
pnpm add nimiq-vitepress-theme
bash
npm install nimiq-vitepress-theme
bash
yarn add nimiq-vitepress-theme
bash
bun add nimiq-vitepress-theme

Prerequisites

Make sure you have VitePress already set up in your project.

Configuration ​

1. Update VitePress Config ​

Use the Nimiq wrapper function around VitePress's standard defineConfig:

ts
import type { NimiqVitepressThemeConfig } from 'nimiq-vitepress-theme'
import { defineNimiqVitepressConfig } from 'nimiq-vitepress-theme'
import { themeConfig } from './themeConfig'

export default defineNimiqVitepressConfig<NimiqVitepressThemeConfig>({ 
  themeConfig,
  title: 'My Docs',
  description: 'My awesome documentation',
  // ... rest of your VitePress config
})

2. Import the Theme ​

Create a theme configuration file:

ts
import { defineNimiqThemeConfig } from 'nimiq-vitepress-theme/theme'

export default defineNimiqThemeConfig({
  enhanceApp({ app }) {
    // Optional: register additional components
  },
})

This will install the layout and register the Nimiq Components globally.

3. Configure the Vite Plugin ​

The theme provides a Vite plugin that adds Git changelog, source code features, and automatic markdown generation:

ts
import { NimiqVitepressVitePlugin } from 'nimiq-vitepress-theme/vite'
import { defineConfig } from 'vite'

export default defineConfig(() => {
  return {
    plugins: [
      NimiqVitepressVitePlugin({
        // GitHub repository URL (required for source code features)
        repoURL: 'https://github.com/your-org/your-repo',

        // Content directory path relative to repository root
        contentPath: 'docs', // Optional, defaults to ''

        // Git changelog configuration (optional)
        gitChangelog: {
          repoURL: 'https://github.com/your-org/your-repo'
        },

        // LLM-friendly markdown generation (optional)
        llms: {
          domain: 'https://docs.example.com',
          injectLLMHint: false
        }
      })
    ]
  }
})

Plugin Options ​

OptionTypeDefaultDescription
repoURLstring-GitHub repository URL used for source code links and as default for GitChangelog
contentPathstring''Directory path where documentation files are located relative to repository root
gitChangelogobject | falseUses repoURLGit changelog configuration or false to disable
llmsobject | booleantrueLLM-friendly markdown generation options or false to disable

The plugin automatically:

  • Configures Git changelog functionality
  • Enables source code viewing and copying features
  • Constructs proper URLs for "View Source" and "Edit Page" links
  • Generates LLM-optimized markdown files using vitepress-plugin-llms

4. Register as Internal Dependency (Optional) ​

Only needed if you want to use Vue components from nimiq-vitepress-theme in your markdown files:

ts
import { defineConfig } from 'vite'

export default defineConfig(() => {
  return {
    ssr: { 
      noExternal: [ 
        'nimiq-vitepress-theme', 
      ], 
    }, 
  }
})
Why is this needed?

In VitePress, dependencies are "externalized" from Vite's SSR transform module system. Learn more in the Vite SSR documentation.

Next Steps ​

Copy page