jQWidgets MCP Server

From npm (recommended)

The server is published as jqwidgets-mcp-server on npm. Install globally:

npm install -g jqwidgets-mcp-server

…or run it on demand without installing — this is what most MCP client configurations call:

npx jqwidgets-mcp-server

Node 18 or later is required. The package bundles the jQWidgets API metadata it needs to answer questions and generate code — you do not need a local checkout of the jQWidgets repository to get started.

From source (contributors)

If you have cloned the jqwidgets-mcp-server repo and want to run from your working copy:

git clone https://github.com/jqwidgets/jqwidgets-mcp-server.git
cd jqwidgets-mcp-server
npm install
npm start

The server speaks MCP over stdio. Register it with the assistant of your choice — restart the assistant afterwards and jqwidgets will appear in its tool list.

Claude Code

claude mcp add jqwidgets npx jqwidgets-mcp-server

Claude Desktop

Add to claude_desktop_config.json:

{
  "mcpServers": {
    "jqwidgets": {
      "command": "npx",
      "args": ["jqwidgets-mcp-server"]
    }
  }
}

VS Code — GitHub Copilot Chat (agent mode)

Create .vscode/mcp.json in your workspace:

{
  "servers": {
    "jqwidgets": {
      "type": "stdio",
      "command": "npx",
      "args": ["jqwidgets-mcp-server"]
    }
  }
}

Cursor, Continue and other MCP clients

Use the same command + args pair (npx + jqwidgets-mcp-server) in whatever config format your client expects.

All tools return structured JSON. Property, method and event tools accept raw: true to preserve the original HTML in description fields.

Tool	Purpose
list_widgets	All 80+ widgets with one-line descriptions.
get_widget	Full API summary for one widget — counts, exampleInit, data types, Angular metadata.
get_widget_properties	Properties with dataType, tsType, default value, description and example init.
get_widget_methods	Methods with return type, arguments and description.
get_widget_events	Events with description and handler code sample.
get_widget_types	Custom enums and interfaces declared by the widget — the valid values for typed properties.
get_required_scripts	Ordered CSS + JS includes for a widget, with feature modules (e.g. ["edit","sort","filter"]) and theme.
list_demos	List shipped demo file names for a widget. Requires a local jQWidgets checkout.
get_demo_code	Read the source of a specific demo file. Requires a local jQWidgets checkout.
generate_example	Emit a runnable example for the chosen framework.

Supported frameworks for generate_example

Two optional environment variables tune the server for your project layout. Neither is required for the default zero-config workflow.

Variable	Default	Purpose
JQWIDGETS_REPO_ROOT	unset	Absolute path to a local checkout of the jQWidgets repository (the folder containing JQX_BUILD_AUTOMATION/, jqwidgets-src/ and demos/). Enables list_demos / get_demo_code and live feature/theme discovery against your checkout instead of the bundled snapshot.
JQWIDGETS_SCRIPTS_PREFIX	../../../jqwidgets-src/	Path prefix injected into generated <script> tags. Match this to where you serve jQWidgets from in your project — for example /vendor/jqwidgets/ on a typical web app.

Setting them in a client config

Most MCP clients let you pass an env block alongside command and args. For Claude Desktop:

{
  "mcpServers": {
    "jqwidgets": {
      "command": "npx",
      "args": ["jqwidgets-mcp-server"],
      "env": {
        "JQWIDGETS_REPO_ROOT": "C:\\path\\to\\jqwidgets-src",
        "JQWIDGETS_SCRIPTS_PREFIX": "/vendor/jqwidgets/"
      }
    }
  }
}

Once the server is wired up, a single prompt drives the whole flow:

Use the jqwidgets MCP server. Generate a runnable HTML page with a
jqxGrid bound to a JSON array of 10 employees, sortable +
filterable + pageable (page size 5), theme energyblue.

The assistant will:

1. Call get_widget for jqxgrid to confirm the surface.
2. Call get_widget_properties with nameFilter: "sort" to find the right property names.
3. Call get_required_scripts with features: ["sort","filter","pager"] and theme: "energyblue".
4. Call generate_example with framework: "jquery" — and hand you a complete HTML file you can save into your project and open in the browser.