Add MIT License, update project name and description in package.json, enhance README.md with installation instructions, and modify index.js for CLI support

- Introduce LICENSE file with MIT License details.
- Change project name to 'mcp-excalidraw-server' and update description in package.json for clarity on features.
- Revise README.md to include new installation options and usage instructions for the npm package.
- Add shebang to index.js for direct CLI execution.
This commit is contained in:
yctimlin
2025-07-11 19:52:18 +00:00
parent cee3b775bf
commit cb743c6a1e
4 changed files with 161 additions and 18 deletions
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2024 MCP Excalidraw Server
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+107 -12
View File
@@ -1,7 +1,9 @@
# Excalidraw MCP Canvas: Live Visual Diagramming with AI Integration # MCP Excalidraw Server: Advanced Live Visual Diagramming with AI Integration
A comprehensive system that combines **Excalidraw's powerful drawing capabilities** with **Model Context Protocol (MCP)** integration, enabling AI agents to create and manipulate diagrams in real-time on a live canvas. A comprehensive system that combines **Excalidraw's powerful drawing capabilities** with **Model Context Protocol (MCP)** integration, enabling AI agents to create and manipulate diagrams in real-time on a live canvas.
> **🚀 NEW: Now available as `mcp-excalidraw-server` on npm!** Install with `npm install -g mcp-excalidraw-server` or run directly with `npx mcp-excalidraw-server`.
## 🚀 What This System Does ## 🚀 What This System Does
- **🎨 Live Canvas**: Real-time Excalidraw canvas accessible via web browser - **🎨 Live Canvas**: Real-time Excalidraw canvas accessible via web browser
@@ -55,9 +57,35 @@ A comprehensive system that combines **Excalidraw's powerful drawing capabilitie
- Node.js 16+ - Node.js 16+
- npm or yarn - npm or yarn
### **1. Clone and Install** ### **Option 1: NPM Installation (Recommended)**
#### **Global Installation**
```bash ```bash
git clone <repository-url> # Install globally
npm install -g mcp-excalidraw-server
# Run the server
mcp-excalidraw-server
```
#### **Run Without Installation**
```bash
# Run directly with npx (no installation needed)
npx mcp-excalidraw-server
```
#### **Local Project Installation**
```bash
# Install in your project
npm install mcp-excalidraw-server
# Run from node_modules
npx mcp-excalidraw-server
```
### **Option 2: Clone from Source**
```bash
git clone https://github.com/yctimlin/mcp_excalidraw.git
cd mcp_excalidraw cd mcp_excalidraw
npm install npm install
``` ```
@@ -174,29 +202,46 @@ The MCP server provides these tools for creating visual diagrams:
## 🔌 Integration with Claude Desktop ## 🔌 Integration with Claude Desktop
### **Using NPM Package (Recommended)**
Add this configuration to your `claude_desktop_config.json`: Add this configuration to your `claude_desktop_config.json`:
```json ```json
{ {
"mcpServers": { "mcpServers": {
"excalidraw_canvas": { "excalidraw": {
"command": "node", "command": "npx",
"args": ["/path/to/mcp_excalidraw/src/index.js"], "args": ["-y", "mcp-excalidraw-server"]
} }
} }
} }
``` ```
## Integration with Cursor ### **Using Global Installation**
Add this configuration to your `claude_desktop_config.json`: If you installed globally with `npm install -g mcp-excalidraw-server`:
```json ```json
{ {
"mcpServers": { "mcpServers": {
"mcp_excalidraw": { "excalidraw": {
"command": "node", "command": "mcp-excalidraw-server",
"args": ["/path/to/mcp_excalidraw/src/index.js"] "args": []
}
}
}
```
### **Using Source Installation**
If you cloned from source:
```json
{
"mcpServers": {
"excalidraw": {
"command": "node",
"args": ["/path/to/mcp_excalidraw/src/index.js"]
} }
} }
} }
@@ -204,6 +249,56 @@ Add this configuration to your `claude_desktop_config.json`:
**Important**: Replace `/path/to/mcp_excalidraw` with the actual absolute path to your installation. **Important**: Replace `/path/to/mcp_excalidraw` with the actual absolute path to your installation.
## 🔧 Integration with Other Tools
### **Cursor IDE**
Add to your `claude_desktop_config.json` or MCP settings:
```json
{
"mcpServers": {
"excalidraw": {
"command": "npx",
"args": ["-y", "mcp-excalidraw-server"]
}
}
}
```
### **VS Code MCP Extension**
For VS Code MCP extension, add to your settings:
```json
{
"mcp": {
"servers": {
"excalidraw": {
"command": "npx",
"args": ["-y", "mcp-excalidraw-server"]
}
}
}
}
```
### **Command Line Usage**
```bash
# Run directly with npx (no installation needed)
npx mcp-excalidraw-server
# Run with global installation
mcp-excalidraw-server
# Run with custom canvas server URL
EXPRESS_SERVER_URL=http://localhost:8080 npx mcp-excalidraw-server
# Run with debug logging
DEBUG=true npx mcp-excalidraw-server
```
## 🛠️ Environment Variables ## 🛠️ Environment Variables
| Variable | Default | Description | | Variable | Default | Description |
+31 -6
View File
@@ -1,15 +1,19 @@
{ {
"name": "excalidraw-mcp", "name": "mcp-excalidraw-server",
"version": "1.0.0", "version": "1.0.0",
"description": "MCP server for Excalidraw", "description": "Advanced MCP server for Excalidraw with real-time canvas, WebSocket sync, and comprehensive diagram management",
"main": "src/index.js", "main": "src/index.js",
"type": "module", "type": "module",
"bin": {
"mcp-excalidraw-server": "src/index.js"
},
"scripts": { "scripts": {
"start": "node src/index.js", "start": "node src/index.js",
"canvas": "node src/server.js", "canvas": "node src/server.js",
"build": "vite build", "build": "vite build",
"dev": "concurrently \"npm run canvas\" \"vite\"", "dev": "concurrently \"npm run canvas\" \"vite\"",
"production": "npm run build && npm run canvas" "production": "npm run build && npm run canvas",
"prepublishOnly": "npm run build"
}, },
"dependencies": { "dependencies": {
"@excalidraw/excalidraw": "^0.18.0", "@excalidraw/excalidraw": "^0.18.0",
@@ -32,21 +36,42 @@
}, },
"keywords": [ "keywords": [
"mcp", "mcp",
"mcp-server",
"excalidraw", "excalidraw",
"model-context-protocol", "model-context-protocol",
"ai", "ai",
"drawing" "drawing",
"diagrams",
"canvas",
"real-time",
"websocket",
"visualization",
"claude",
"ai-tools"
], ],
"author": "", "author": {
"name": "yctimlin",
"email": "c22647809@gmail.com"
},
"license": "MIT", "license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/yctimlin/mcp_excalidraw.git"
},
"homepage": "https://github.com/yctimlin/mcp_excalidraw#readme",
"bugs": {
"url": "https://github.com/yctimlin/mcp_excalidraw/issues"
},
"engines": { "engines": {
"node": ">=16.0.0" "node": ">=16.0.0"
}, },
"publishConfig": { "publishConfig": {
"access": "public" "access": "public",
"registry": "https://registry.npmjs.org/"
}, },
"files": [ "files": [
"src/**/*", "src/**/*",
"dist/**/*",
"README.md", "README.md",
"LICENSE" "LICENSE"
] ]
+2
View File
@@ -1,3 +1,5 @@
#!/usr/bin/env node
// Disable colors to prevent ANSI color codes from breaking JSON parsing // Disable colors to prevent ANSI color codes from breaking JSON parsing
process.env.NODE_DISABLE_COLORS = '1'; process.env.NODE_DISABLE_COLORS = '1';
process.env.NO_COLOR = '1'; process.env.NO_COLOR = '1';