MCP Server

Markdown ChatGPT Claude

Bring the CoreUI Vue Data Grid documentation into your AI coding assistant with the @coreui/docs-mcp Model Context Protocol server.

On this page

Introduction

Model Context Protocol (MCP) is an open standard that lets AI assistants connect to external tools and data sources. The @coreui/docs-mcp server gives your assistant direct access to the official CoreUI documentation, so it answers from the current docs instead of relying on stale training data.

Point it at the CoreUI Vue Data Grid docs with the --base-path option shown below.

It provides:

Documentation pages — getting started, features, columns, and API reference.
Live content — read on demand from coreui.io, always matching the latest release.
Structured API — options, events, and methods for the grid.

The server runs locally over stdio via npx — no global install required.

Installation

Claude Code

Add the server with the CLI, then start a new session and run /mcp to verify the connection:

claude mcp add coreui-data-grid -s user -- npx -y @coreui/docs-mcp --framework vue --base-path /data-grid/vue/docs

Cursor

Create .cursor/mcp.json in your project (or ~/.cursor/mcp.json for global configuration):

{
  "mcpServers": {
    "coreui-data-grid": {
      "command": "npx",
      "args": ["-y", "@coreui/docs-mcp", "--framework", "vue", "--base-path", "/data-grid/vue/docs"]
    }
  }
}

VS Code

Create .vscode/mcp.json in your project. Note that VS Code uses the servers key:

{
  "servers": {
    "coreui-data-grid": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@coreui/docs-mcp", "--framework", "vue", "--base-path", "/data-grid/vue/docs"]
    }
  }
}

Windsurf

Edit ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "coreui-data-grid": {
      "command": "npx",
      "args": ["-y", "@coreui/docs-mcp", "--framework", "vue", "--base-path", "/data-grid/vue/docs"]
    }
  }
}

Claude Desktop

Edit claude_desktop_config.json (Settings → Developer → Edit Config):

{
  "mcpServers": {
    "coreui-data-grid": {
      "command": "npx",
      "args": ["-y", "@coreui/docs-mcp", "--framework", "vue", "--base-path", "/data-grid/vue/docs"]
    }
  }
}

OpenAI Codex

Add it with the CLI, or edit ~/.codex/config.toml directly:

codex mcp add coreui-data-grid -- npx -y @coreui/docs-mcp --framework vue --base-path /data-grid/vue/docs

[mcp_servers.coreui-data-grid]
command = "npx"
args = ["-y", "@coreui/docs-mcp", "--framework", "vue", "--base-path", "/data-grid/vue/docs"]

Tools

Once connected, your assistant can call the following tools:

Tool	Description
`list_components`	List documentation pages, optionally filtered by section or a substring.
`search_docs`	Search the documentation and return the best matching pages.
`get_doc_page`	Fetch the full Markdown of a page by slug or URL.
`get_component_api`	Get the structured API (options, events, methods) for the grid.

Configuration

Flag	Environment variable	Default	Description
`--framework <list>`	`COREUI_DOCS_FRAMEWORKS`	`bootstrap,react,vue`	Enabled editions (comma-separated). The first is the default for tools.
`--base-url <url>`	`COREUI_DOCS_BASE_URL`	`https://coreui.io`	Origin of the CoreUI site. Override only for a staging or self-hosted mirror.
`--base-path <tmpl>`	`COREUI_DOCS_BASE_PATH`	`/{framework}/docs`	Path after the origin where the docs live; `{framework}` is substituted.
`--docs-path <map>`	`COREUI_DOCS_PATHS`	—	Per-framework path overrides, `fw=path` comma-separated.
`--ttl <minutes>`	`COREUI_DOCS_TTL_MINUTES`	`360`	Cache freshness window.
—	`COREUI_DOCS_CACHE_DIR`	OS cache directory	On-disk cache location.

Example prompts

Once installed, try asking your AI assistant:

“How do I enable row selection in CoreUI Vue Data Grid?”
“What options does CoreUI Vue Data Grid accept?”
“Show me the CoreUI Vue Data Grid pagination documentation.”
“How do I export CoreUI Vue Data Grid data to CSV?”

The package is open source and published as @coreui/docs-mcp.