Vitepress

// .vitepress/config.ts
import { defineConfig } from
  'vitepress';

export default defineConfig({
  title: 'My Docs',
  description:
    'Project documentation',
  themeConfig: {
    nav: [
      { text: 'Guide',
        link: '/guide/' },
      { text: 'API',
        link: '/api/' }
    ],
    sidebar: {
      '/guide/': [{
        text: 'Getting Started',
        items: [
          { text: 'Install',
            link:
              '/guide/install'
          },
          { text: 'Quick Start',
            link:
              '/guide/quickstart'
          }
        ]
      }]
    },
    search: {
      provider: 'local'
    }
  }
});

---
title: Installation Guide
---

## Prerequisites

Node.js 18+ is required.

::: tip
Use nvm to manage Node
versions easily.
:::

## Install

```bash
npm install my-package

// Lines 2 and 4 highlighted
import { setup } from 'pkg';

const config = setup({
  debug: true
});

### Advanced Tips

Use Vue components inside Markdown pages for interactive documentation demos, such as live prop explorers or configurable code sandboxes. Configure automatic sidebar generation from directory structure to reduce manual navigation maintenance. Deploy to GitHub Pages with the built-in deployment workflow configuration, or use Netlify and Vercel for zero-configuration continuous deployment on every commit.

## When to Use It?

### Use Cases

Build API reference documentation with code examples and hierarchical navigation. Create a project guide with searchable content and custom branding. Host versioned documentation for a library with release-specific pages.

### Related Topics

Vite, static site generation, Markdown, Vue, documentation, technical writing, and developer portals.

## Important Notes

### Requirements

Node.js version 18 or higher for running the VitePress development server and build process. Markdown content files organized in a directory structure matching the desired URL hierarchy. Configuration file at .vitepress/config.ts defining site metadata, navigation, and theme settings.

### Usage Recommendations

**Do:** organize documentation into logical sections with clear sidebar navigation for easy browsing. Use frontmatter metadata for page titles and descriptions to improve search engine SEO. Enable local search to help users find content without external service dependencies, keeping the setup self-contained and functional without third-party accounts.

**Don't:** embed heavy JavaScript widgets that slow page load times since documentation should be fast. Manually maintain sidebar configuration when automatic generation from file structure is possible. Skip setting proper page descriptions since search engines use them for indexing.

### Limitations

VitePress is optimized for documentation and is not a general-purpose static site generator for complex websites. Dynamic content requiring server-side processing needs separate backend API endpoints since VitePress produces static files only. Large documentation sites with thousands of pages may experience longer build times during full site generation and search indexing.