ModelScope AI图像生成器的MCP服务器,支持生成web设计占位图片
npm install mcp-image-generatorbash
全局安装
npm install -g mcp-image-generator
或者本地安装
npm install mcp-image-generator
`
$3
`bash
git clone https://github.com/your-username/mcp-image-generator.git
cd mcp-image-generator
pnpm install
`
快速开始
$3
前往 ModelScope 注册账号并获取API密钥。
$3
#### 方式一:MCP服务器模式(推荐)
`bash
如果全局安装
mcp-image-generator
或者本地运行
node index.js
`
然后在支持MCP的客户端(如Claude Desktop)中配置此服务器。
#### 方式二:Claude Desktop集成
在Claude Desktop的配置文件中添加:
`json
{
"mcpServers": {
"image-generator": {
"command": "mcp-image-generator",
"env": {
"MODELSCOPE_API_KEY": "your-api-key-here"
}
}
}
}
`
#### 方式三:Cursor IDE集成
在Cursor IDE中配置MCP服务器:
1. 创建MCP配置文件
在你的项目根目录或全局配置目录创建 mcp-config.json:
`json
{
"mcpServers": {
"image-generator": {
"command": "mcp-image-generator",
"args": [],
"env": {
"MODELSCOPE_API_KEY": "your-api-key-here"
}
}
}
}
`
2. 在Cursor设置中配置
打开Cursor IDE设置(Ctrl+, 或 Cmd+,),搜索"MCP"并添加配置:
`json
{
"mcp.servers": {
"image-generator": {
"command": "mcp-image-generator",
"env": {
"MODELSCOPE_API_KEY": "your-api-key-here"
}
}
}
}
`
3. 或者使用本地路径
如果你克隆了源码,可以直接指向本地文件:
`json
{
"mcp.servers": {
"image-generator": {
"command": "node",
"args": ["path/to/mcp-image-generator/index.js"],
"env": {
"MODELSCOPE_API_KEY": "your-api-key-here"
}
}
}
}
`
4. 重启Cursor IDE
配置完成后,重启Cursor IDE以加载MCP服务器。
5. 使用MCP工具
配置成功后,你可以在Cursor的AI助手中使用以下命令:
- @generate_image - 生成基础图片
- @generate_placeholder_image - 生成占位图片
$3
#### Windows
`
%APPDATA%\Cursor\User\settings.json
`
#### macOS
`
~/Library/Application Support/Cursor/User/settings.json
`
#### Linux
`
~/.config/Cursor/User/settings.json
`
$3
1. MCP服务器未启动
- 检查配置文件语法是否正确
- 确保API密钥设置正确
- 查看Cursor的开发者工具控制台错误信息
2. 命令行工具未找到
- 确保已全局安装: npm install -g mcp-image-generator
- 检查PATH环境变量是否包含npm全局包路径
3. API调用失败
- 验证ModelScope API密钥是否有效
- 检查网络连接是否正常
- 确保API密钥有足够的配额
4. 调试模式
开启调试模式查看详细日志:
`json
{
"mcp.servers": {
"image-generator": {
"command": "mcp-image-generator",
"env": {
"MODELSCOPE_API_KEY": "your-api-key-here",
"DEBUG": "mcp:*"
}
}
}
}
`
可用工具
$3
基础图片生成工具,需要提供英文提示词。
$3
智能占位图片生成工具,根据用途自动优化提示词。
支持的用途:
- hero-banner - 首页横幅
- product-showcase - 产品展示
- user-avatar - 用户头像
- background - 背景图
- logo - 标志设计
- icon - 图标
- illustration - 插图
- photo - 摄影
支持的风格:
- modern - 现代简约
- minimal - 极简主义
- corporate - 企业风格
- colorful - 多彩活力
- elegant - 优雅奢华
- casual - 休闲友好
使用示例
$3
1. 生成现代办公室背景
`
@generate_placeholder_image
用途: background
描述: 现代办公室,干净整洁的工作环境
风格: modern
尺寸: 1920x1080
`
2. 生成产品展示图片
`
@generate_placeholder_image
用途: product-showcase
描述: 笔记本电脑产品展示
风格: minimal
尺寸: 1200x800
`
3. 生成自定义图片
`
@generate_image
提示词: professional office workspace with natural lighting, modern furniture, clean desk setup
宽度: 1920
高度: 1080
`
$3
`javascript
{
"purpose": "background", // 图片用途
"description": "现代办公室环境", // 中文描述
"style": "modern", // 风格
"width": 1920, // 宽度
"height": 1080 // 高度
}
``