Claude Code Plugins

Community-maintained marketplace

Feedback

Use when creating Docusaurus plugins (remark, rehype, theme, content, lifecycle) to extend markdown, modify HTML, or add custom functionality

Install Skill

1Download skill
2Enable skills in Claude

Open claude.ai/settings/capabilities and find the "Skills" section

3Upload to Claude

Click "Upload skill" and select the downloaded ZIP file

Note: Please verify skill by going through its instructions before using it.

SKILL.md

name docusaurus-plugins
description Use when creating Docusaurus plugins (remark, rehype, theme, content, lifecycle) to extend markdown, modify HTML, or add custom functionality

Docusaurus Plugin Guide

Quick Start

// Remark plugin - transforms markdown AST
module.exports = function remarkPlugin(options = {}) {
  return async function transformer(ast, vfile) {
    const { visit } = require('unist-util-visit');

    visit(ast, 'link', node => {
      // Transform nodes
      node.data = node.data || {};
      node.data.hProperties = { className: 'custom' };
    });

    return ast;
  };
};

// In docusaurus.config.js:
// remarkPlugins: [require('./plugins/my-plugin')]

Core Principles

  • 5 Plugin Types: Remark (markdown), Rehype (HTML), Lifecycle (routes/webpack), Theme (components), Content (custom data)
  • Remark: Transforms markdown before HTML conversion, use unist-util-visit for AST traversal
  • Rehype: Transforms HTML after compilation, processes HAST (HTML AST)
  • Lifecycle: Most flexible, implements hooks like loadContent(), contentLoaded(), postBuild()
  • Export function: Returns transformer (remark/rehype) or plugin object (lifecycle)

Reference Files

Detailed guides for each plugin type: