Chapter 10 · Mapbox MCP Devkit Patterns
Subchapter 10.2
references/setup.mdMarkdown3 KBView on GitHub
Easiest setup - Use Mapbox’s hosted DevKit MCP server at:
https://mcp-devkit.mapbox.com/mcpNo installation required, just configure your AI assistant.
Authentication: The hosted server supports OAuth, so no token configuration needed! Simply add the server URL:
Add to ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows):
{
"mcpServers": {
"mapbox-devkit-mcp": {
"command": "npx",
"args": ["mcp-remote", "https://mcp-devkit.mapbox.com/mcp"]
}
}
}You’ll be prompted to authenticate via OAuth on first use.
Claude Code supports both user-level and project-level MCP configuration:
User-level (applies to all projects) - ~/.claude.json:
{
"mcpServers": {
"mapbox-devkit": {
"url": "https://mcp-devkit.mapbox.com/mcp"
}
}
}Project-level (specific project, can commit to git) - .mcp.json in repository root:
{
"mcpServers": {
"mapbox-devkit": {
"url": "https://mcp-devkit.mapbox.com/mcp"
}
}
}See Claude Code settings documentation (opens in a new tab) for more details on configuration scopes.
Create or edit .cursor/mcp.json (project-local) or ~/.cursor/mcp.json (global):
{
"mcpServers": {
"mapbox-devkit": {
"url": "https://mcp-devkit.mapbox.com/mcp"
}
}
}After saving, restart Cursor. Click “Needs authentication” when prompted and follow the OAuth flow.
Create or edit mcp.json:
{
"servers": {
"mapbox-devkit": {
"type": "http",
"url": "https://mcp-devkit.mapbox.com/mcp"
}
}
}After saving, refresh the MCP service in VS Code. Requires GitHub Copilot with MCP support enabled.
Similar configuration using the hosted URL with OAuth support.
For development, debugging, or customization:
# Clone the DevKit server
git clone https://github.com/mapbox/mcp-devkit-server.git
cd mcp-devkit-server
# Install dependencies
npm install
# Build the server
npm run buildConfiguration for self-hosted (Claude Desktop):
{
"mcpServers": {
"MapboxDevKitServer": {
"command": "node",
"args": ["/Users/username/github-projects/mcp-devkit-server/dist/esm/index.js"],
"env": {
"MAPBOX_ACCESS_TOKEN": "some token"
}
}
}
}Replace /Users/username/github-projects/ with your actual path.
Ask your AI assistant:
"List the available Mapbox DevKit tools"You should see 30+ tools including:
create_style_tool, list_styles_tool, update_style_tool, delete_style_tool, preview_style_tool, etc.create_token_tool, list_tokens_toolvalidate_geojson_tool, validate_style_tool, validate_expression_toolbounding_box_tool, coordinate_conversion_tool, tilequery_toolget_latest_mapbox_docs_tool