vitepress-plugin-glossary

VitePress Plugin Glossary

A VitePress plugin that automatically identifies and links glossary terms with interactive tooltips.

Features

• 🔍 Automatically detects and links glossary terms in your markdown content
• 🎯 Option to link only the first occurrence of each term per page
• 🎨 Beautiful, customizable tooltips using Vue components
• 🚫 Ability to skip terms using //double slashes//
• 📦 Support for both file-based and direct object glossaries
• 🔧 TypeScript support
• 🎉 Zero configuration required

Quick Start

npm install vitepress-plugin-glossary

// .vitepress/config.mts
import { defineConfig } from 'vitepress';
import { markdownGlossaryPlugin } from 'vitepress-plugin-glossary';
import glossary from './glossary.json';

export default defineConfig({
  markdown: {
    config: (md) => {
      md.use(markdownGlossaryPlugin, {
        glossary: glossary,
        firstOccurrenceOnly: true
      });
    }
  }
});

// .vitepress/theme/index.js
import DefaultTheme from 'vitepress/theme';
import GlossaryTooltip from 'vitepress-plugin-glossary/vue';

export default {
    ...DefaultTheme,
    enhanceApp({ app }) {
        app.component('GlossaryTooltip', GlossaryTooltip);
    }
};

Documentation

For detailed setup instructions and configuration options, see:

• Installation Guide

Example

// glossary.json
{
  "VitePress": "A Static Site Generator powered by Vite and Vue",
  "Vue": "A Progressive JavaScript Framework"
}

// Your markdown content
VitePress is built with Vue.

To prevent linking: //VitePress//

Requirements

• Node.js 16 or higher
• VitePress 1.0.0 or higher
• Vue 3.3.0 or higher

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License - see the LICENSE file for details