@shramiknakarmi/polaris-mcp-server NPM

Shopify Polaris MCP Server for AI Assistants

This project implements a Model Context Protocol (MCP) server that provides tools and prompts for working with Shopify Polaris UI components. It helps developers find, understand, and implement Polaris components in their applications.

Features

Search for Polaris components by name, category, or functionality
Get detailed information about specific components, including props, best practices, and related components
Access code examples for implementing components
Use specialized prompts for component implementation, layout design, and customization

Setup

Installation

To install and run the Shopify Polaris MCP server using npx, use the following command:

npx -y polaris-mcp-server@latest

Usage with Cursor or Claude Desktop

Add the following configuration to your MCP client. For more information, read the Cursor MCP documentation or the Claude Desktop MCP guide.

{
    "mcpServers": {
        "polaris-mcp-server": {
            "command": "npx",
            "args": ["-y", "polaris-mcp-server@latest"]
        }
    }
}

On Windows, you might need to use this alternative configuration:

{
    "mcpServers": {
        "polaris-mcp-server": {
            "command": "cmd",
            "args": ["/k", "npx", "-y", "polaris-mcp-server@latest"]
        }
    }
}

Available Tools

This MCP server provides the following tools:

Tool Name	Description
`search_polaris_components`	Search for Polaris components by name, category, or functionality
`get_component_details`	Get detailed information about a specific component
`get_component_examples`	Get code examples for using a specific component

Available Prompts

This MCP server provides the following prompts:

Prompt Name	Description
`polaris_component_implementation`	Help you implement a Polaris component in your application
`polaris_layout_design`	Help you design layouts using Polaris components
`polaris_component_customization`	Help you customize Polaris components

Development

Prerequisites

Node.js 14.17.0 or higher
npm or yarn

Setup

Clone the repository
Install dependencies:
```
npm install
```
Build the project:
```
npm run build
```
Run the scraper to collect component data:
```
npm run scrape
```
Start the server:
```
npm start
```

Project Structure

data/: Contains JSON files with component data
scripts/: Contains scripts for data collection
src/: Contains the source code for the MCP server
- tools-all.ts: Implementation of MCP tools for Polaris components
- prompts-all.ts: Implementation of MCP prompts for Polaris components
- index.ts: Main server file
tests/: Contains test files