🚀 MCP快速条
一个美观、轻量级的系统托盘应用程序，通过模型上下文协议（MCP）将Claude AI与强大的工具集成在一起。采用Tauri构建，具有原生性能和现代网络技术。
______________________________________________________________________
✨ 特性
- 🤖 Claude AI集成 -直接从系统托盘与Claude聊天
- 🔧 MCP工具 -使用多种强大的工具：
- 🔍 网页搜索 -使用Serper API搜索网页 - 📁 GitHub -列出并管理您的存储库 - 📸 截图 -立即捕获屏幕截图 - ☁️ 本地文件 -访问和管理本地文件
- 🎨 漂亮的UI -现代、干净的界面，支持暗模式
- ⚡ 本地性能 -采用Tauri制造，速度快，效率高
- 🔒 安全 -API密钥本地存储在
.env文件 - 🖥️ 系统托盘 -从菜单栏/系统托盘快速访问
______________________________________________________________________
📋 先决条件
在开始之前，请确保已安装以下内容：
平台特定要求
macOS
xcode-select --install视窗
- Microsoft Visual Studio C++生成工具
- WebView2（通常预装在Windows 10/11上）
Linux（Debian/Ubuntu）
sudo apt update
sudo apt install libwebkit2gtk-4.0-dev \
build-essential \
curl \
wget \
file \
libssl-dev \
libgtk-3-dev \
libayatana-appindicator3-dev \
librsvg2-dev______________________________________________________________________
🚀 安装和设置
步骤1：克隆存储库
git clone https://github.com/yourusername/mcp-quickbar.git
cd mcp-quickbar步骤2：安装依赖项
npm install这将安装所有必需的Node.js依赖项。
步骤3：配置环境变量
- 复制示例环境文件：
cp .env.example .env- 编辑
.env并添加您的API密钥：
# Anthropic API Key - Get from https://console.anthropic.com/
ANTHROPIC_API_KEY=sk-ant-api03-your-key-here
# GitHub Personal Access Token - Generate from https://github.com/settings/tokens
GITHUB_TOKEN=ghp_your-token-here
# Serper API Key - Get from https://serper.dev/ (2,500 free searches/month)
SERPER_API_KEY=your-serper-key-here
# For Vite (frontend access)
VITE_ANTHROPIC_API_KEY=sk-ant-api03-your-key-here
VITE_GITHUB_TOKEN=ghp_your-token-here
VITE_SERPER_API_KEY=your-serper-key-here⚠️ 重要： 永远不要承诺你的 .env 文件到版本控制！它已经在里面了 .gitignore.
______________________________________________________________________
🎮 运行应用程序
发展模式
使用热重载启动开发服务器：
npm run dev这将：
- 在端口5173上启动Vite-dev服务器
- 启动Tauri应用程序
- 为前端和后端更改启用热重新加载
应用程序窗口将自动打开。您还可以从系统托盘图标访问它。
生产建设
构建生产应用程序：
npm run build构建的应用程序将位于：
- macOS:
src-tauri/target/release/bundle/macos/ - 视窗:
src-tauri/target/release/bundle/msi/ - Linux:
src-tauri/target/release/bundle/appimage/
______________________________________________________________________
📖 如何使用
1.启动应用程序
跑 npm run dev 或者双击构建的应用程序。
2.从系统托盘进入
- macOS：单击菜单栏中的图标
- 视窗：单击系统托盘中的图标
- Linux：单击系统托盘中的图标
3.使用快速行动
点击任何工具按钮：
- 🔍 网页搜索 -输入搜索查询并获取结果
- 📁 GitHub仓库 -列出您的存储库
- 📸 截图 -捕捉您的屏幕
- ☁️ 驱动器文件 -访问谷歌云端硬盘
4.最小化窗口
单击“最小化”以最小化Dock的窗口。您可以通过以下方式恢复它：
- 点击Dock中的应用程序图标
- 单击菜单栏（macOS）或系统托盘中的托盘图标
______________________________________________________________________
🔑 获取API密钥
无烟煤API密钥（Claude AI）
- 首选 拟人控制台
- 注册或登录
- 导航至 API密钥
- 点击 创建密钥
- 复制密钥（以开头
sk-ant-)
GitHub个人访问令牌
- 首选
- 点击 生成新令牌（经典）
- 选择范围：
repo,read:user - 点击 生成令牌
- 复制令牌（以开头
ghp_)
Serper API密钥（网络搜索）
- 首选 Serper.dev
- 注册一个免费帐户
- 每月获得2500次免费搜索
- 从仪表板复制API密钥
______________________________________________________________________
🛠️ 发展
项目结构
mcp-quickbar/
├── src/ # Frontend source code
│ ├── index.html # Main HTML file
│ ├── main.js # UI logic and MCP integration
│ ├── mcp-setup.js # MCP tools configuration
│ ├── styles.css # Modern styling
│ └── assets/ # Images and icons
├── src-tauri/ # Rust backend
│ ├── src/
│ │ └── main.rs # Tauri app with system tray
│ ├── Cargo.toml # Rust dependencies
│ ├── tauri.conf.json # Tauri configuration
│ └── icons/ # App icons
├── .env # API keys (DO NOT COMMIT!)
├── .env.example # Template for .env
├── package.json # Node.js dependencies
├── vite.config.js # Vite configuration
└── README.md # This file可用脚本
npm run dev # Start development server
npm run build # Build for production
npm run tauri # Run Tauri CLI commands添加新的MCP工具
- 在中定义工具
src/mcp-setup.js - 在中添加工具处理程序
src-tauri/src/main.rs - 更新中的UI
src/index.html和src/main.js
______________________________________________________________________
🐛 故障排除
端口5173已在使用中
# Kill the process using the port
lsof -ti:5173 | xargs kill -9Rust编译错误
# Update Rust toolchain
rustup update缺失依赖项
# Clean install
rm -rf node_modules package-lock.json
npm install系统托盘未显示
- macOS：检查系统首选项>Dock和菜单栏
- 视窗：检查任务栏设置
- Linux：确保你有一个系统托盘（例如，通过GNOME Shell扩展）
构建失败
# Clean build
rm -rf dist src-tauri/target
npm run build______________________________________________________________________
🎨 定制
更改窗口大小
编辑 src-tauri/tauri.conf.json:
{
"app": {
"windows": [{
"width": 900,
"height": 700
}]
}
}修改UI主题
在中编辑CSS变量 src/styles.css:
:root {
--primary: #6366f1; /* Change primary color */
--bg: #ffffff; /* Change background */
}______________________________________________________________________
🚢 部署
配电楼
# Build for your current platform
npm run build
# The installer will be in src-tauri/target/release/bundle/代码签名（macOS）
要在macOS上分发，您需要对应用程序进行签名：
# Set up in tauri.conf.json
{
"bundle": {
"macOS": {
"signingIdentity": "Your Developer ID"
}
}
}______________________________________________________________________
🤝 贡献
欢迎投稿！请随时提交拉取请求。
- 复刻仓库
- 创建功能分支(
git checkout -b feature/AmazingFeature) - 提交您的更改(
git commit -m 'Add some AmazingFeature') - 推到分支(
git push origin feature/AmazingFeature) - 打开拉取请求
______________________________________________________________________
📄 许可证
此项目根据MIT许可证获得许可-有关详细信息，请参阅许可证文件。
______________________________________________________________________
🙏 致谢
______________________________________________________________________
📞 支持
- 文档：检查
SETUP.md和CHECKLIST.md文件 - 问题:
- 讨论:
______________________________________________________________________
织机演示
🗺️ 路线图
- \[\]完整的Claude AI聊天界面
- \[\]更多MCP工具（日历、电子邮件等）
- \[\]对话历史记录
- \[\]自定义键盘快捷键
- \[\]多个主题选项
- \[\]自定义工具插件系统
______________________________________________________________________
由...制作❤️ 使用Tauri和MCP