Chapter 9: Plugins

---

Plugins Overview

Claude Code's plugin system allows you to extend its functionality by adding new tools, commands, and integrations.

What can plugins do?

• 🔧 Add custom tools
• 📦 Integrate third-party services
• 🎨 Customize output formats
• ⚡ Extend command set

---

Installing Plugins

Install from npm

9.2 安装插件

# Install plugin
npm install -g @claude-code/plugin-name

# Or use claude CLI
claude plugin install plugin-name

Configure Plugins

Edit ~/.config/claude-code/plugins.json:

{
  "plugins": {
    "plugin-name": {
      "enabled": true,
      "config": {
        "option1": "value1",
        "option2": "value2"
      }
    }
  }
}

View Installed Plugins

claude plugin list

Installed plugins:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✓ context7 (v1.0.0) - Enhanced documentation
✓ prettier (v1.2.0) - Code formatting
✓ eslint (v2.0.0) - Linting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

---

Popular Plugins

1. Context7 Plugin

Function: Enhanced documentation access

Install:

9.3 常用插件

claude plugin install context7

Usage:

You: how to use React 18 useTransition?

Claude: [Using Context7 plugin]
Fetching latest React documentation...

useTransition allows you to mark state updates as transitions...

2. Prettier Plugin

Function: Automatic code formatting

Configure:

{
  "plugins": {
    "prettier": {
      "enabled": true,
      "config": {
        "semi": true,
        "singleQuote": true,
        "tabWidth": 2
      }
    }
  }
}

Usage:

You: format src/app.js

Claude: [Using Prettier plugin]
✓ Formatted src/app.js
  - Fixed 12 formatting issues

3. ESLint Plugin

Function: Code quality checking

Usage:

You: check code quality issues

Claude: [Using ESLint plugin]
Found 5 issues:
  ⚠ src/api.js:23 - Unused variable 'data'
  ⚠ src/utils.js:45 - Missing return statement
  ...

---

Developing Custom Plugins

Plugin Structure

9.4 开发自定义插件

// my-plugin/index.js
module.exports = {
  name: 'my-plugin',
  version: '1.0.0',
  description: 'My custom plugin',

  // Plugin initialization
  async init(context) {
    console.log('Plugin initialized');
  },

  // Register tools
  tools: {
    'my-tool': {
      description: 'My custom tool',
      async execute(params) {
        // Tool logic
        return { result: 'success' };
      }
    }
  },

  // Register commands
  commands: {
    'my-command': {
      description: 'My custom command',
      async handler(args) {
        // Command logic
      }
    }
  }
};

package.json

{
  "name": "@claude-code/plugin-my-plugin",
  "version": "1.0.0",
  "description": "My custom Claude Code plugin",
  "main": "index.js",
  "keywords": ["claude-code", "plugin"],
  "peerDependencies": {
    "@claude-code/sdk": "^1.0.0"
  }
}

Publish Plugin

# Test plugin
npm link

# Publish to npm
npm publish

---

Plugin Management

Enable/Disable Plugins

9.5 插件管理

# Disable plugin
claude plugin disable plugin-name

# Enable plugin
claude plugin enable plugin-name

Update Plugins

# Update single plugin
claude plugin update plugin-name

# Update all plugins
claude plugin update-all

Uninstall Plugins

claude plugin uninstall plugin-name

---

Summary

In this chapter, we learned:

• ✅ Plugin system overview
• ✅ How to install and configure plugins
• ✅ Popular plugins introduction
• ✅ Develop custom plugins
• ✅ Plugin management operations

Key Takeaways:

• Plugins extend Claude Code functionality
• Can install from npm or develop your own
• Flexible configuration options
• Easy to manage and update

Next Step: Chapter 10 introduces Agent Skills!

---