Angular MCP服务器
一个模型上下文协议(MCP)服务器,提供对Angular文档的全面访问,使AI助手能够通过智能相关性评分搜索和检索与Angular相关的信息。
](https://badge.fury.io/js/angular-mcp-server) 
特性
服务器为Angular文档提供了5个强大的工具:
🔍 search_angular_docs
使用智能相关性评分在Angular文档中搜索特定主题、概念或关键字。
- 参数:
- query (必填):搜索查询(例如,“组件”、“依赖注入”、“路由”) - category (可选):按类别筛选(组件、模板、指令等) - limit (可选):最大结果数(默认值:5)
📖 get_angular_topic
获取有关特定Angular主题的详细信息。
- 参数:
- topic (必填):特定主题名称(例如,“组件生命周期”、“信号概述”)
📋 list_angular_categories
列出所有可用的Angular文档类别和主题计数。
🌟 get_angular_overview
全面了解Angular框架及其功能。
💡 find_angular_examples
查找Angular概念的代码示例和实际实现。
- 参数:
- concept (必填):用于查找示例的角度概念(例如,“组件”、“服务”、“指令”)
用法
使用克劳德桌面
将此配置添加到您的Claude Desktop MCP设置中:
macOS: ~/Library/Application Support/Claude/claude_desktop_config.json 窗户: %APPDATA%/Claude/claude_desktop_config.json
{
"mcpServers": {
"angular-docs": {
"command": "npx",
"args": ["angular-mcp-server"]
}
}
}使用VSCode(Cline)
添加到您的Cline MCP设置中: ~/Library/Application Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json
{
"mcpServers": {
"angular-docs": {
"command": "npx",
"args": ["angular-mcp-server"],
"disabled": false,
"autoApprove": []
}
}
}使用Amazon Q作为命令行
Amazon Q CLI通过配置支持MCP服务器。将此添加到MCP配置中:
{
"mcpServers": {
"angular-docs": {
"command": "npx",
"args": ["angular-mcp-server"]
}
}
}配置后,您可以直接通过Amazon Q与Angular文档交互:
# Start Amazon Q chat with MCP support
q chat
# Example queries you can ask:
# "Search for Angular component lifecycle methods"
# "Show me dependency injection examples"
# "How do I implement reactive forms?"
# "List all Angular documentation categories"Amazon Q将自动使用Angular MCP Server提供全面的Angular文档和代码示例。
查询示例
一旦与您的AI助手集成,您就可以提出以下问题:
- “搜索Angular组件生命周期方法”
- “显示有关角度信号的信息”
- “在Angular中查找依赖注入的示例”
- “列出所有Angular文档类别”
- “获取Angular框架概述”
- “我如何在Angular中实现响应式表单?”
- “Angular测试的最佳实践是什么?”
文件覆盖范围
服务器提供访问 84个Angular文档主题 横跨 15个类别:
- 组件 (7个主题)-组件基础、生命周期、样式、输入/输出
- 模板 (7个主题)-模板语法、绑定、控制流、变量
- 指令 (5个主题)-内置和自定义指令、组合
- 信号 (3个主题)-使用Angular信号的响应式编程
- 依赖注入 (7个主题)-DI模式、提供者、服务
- 表单 (6个主题)-反应式和模板驱动的表单,验证
- 路由 (7个主题)-导航、路线保护、延迟加载
- HTTP客户端 (5个主题)-API通信、拦截器、测试
- 测试 (12个主题)-单元测试、组件测试、e2e测试
- 服务器端渲染 (6个主题)-SSR、水合作用、预渲染
- 动画 (3个主题)-组件和路线动画
- RxJS集成 (2个主题)-使用Angular进行观测
- API和CLI (2个主题)-参考文件
- 高级主题 (9个主题)-性能、安全、最佳实践
- 入门指南 (3个主题)-安装、设置、样式指南
发展
从源头构建
git clone https://github.com/SAIPRANAY-GANGULA/angular-mcp-server.git
cd angular-mcp-server
npm install
npm run build脚本
npm run build:编译TypeScript并复制文档文件npm run start:运行已编译的服务器npm run dev:以开发模式构建和运行npm run test:由MCP检验员进行测试
项目结构
angular-mcp-server/
├── src/
│ ├── index.ts # Main server implementation
│ ├── llms.txt # Angular docs structure
│ └── llms-full.txt # Detailed Angular content
├── build/ # Compiled JavaScript (generated)
├── package.json
├── tsconfig.json
├── LICENSE
└── README.md需求
- Node.js:v18.0.0或更高版本
- npm:v8.0.0或更高版本
贡献
欢迎投稿!请随时提交拉取请求。对于重大更改,请先打开一个问题来讨论您想要更改的内容。
- 分叉存储库
- 创建功能分支(
git checkout -b feature/AmazingFeature) - 提交您的更改(
git commit -m 'Add some AmazingFeature') - 推到分支(
git push origin feature/AmazingFeature) - 打开拉取请求
故障排除
常见问题
- 服务器未启动:确保已安装Node.js v18+
- 权限错误:尝试用
sudo用于全球安装 - MCP客户端未连接:验证配置文件语法
- 没有搜索结果:检查文档文件是否已正确加载
获取帮助
许可证
此项目根据MIT许可证获得许可-请参阅 许可证 文件以获取详细信息。
致谢
- 与 模型上下文协议SDK
- Angular文档来源于 角度.dev
- 受到不断发展的MCP生态系统的启发
______________________________________________________________________
由以下材料制成❤️ 面向Angular和AI社区
