io.github.nrwl/nx-mcp
编码与调试编辑精选by nrwl
io.github.nrwl/nx-mcp 是让 AI 助手直接操作你的 Nx 项目依赖和脚本的工具。
这个服务器解决了 Nx 开发者手动管理复杂 monorepo 的痛点,适合那些经常需要查询依赖关系或运行脚本的团队。不过,它目前工具列表为空,功能可能还比较基础,建议先小范围试用。
什么是 io.github.nrwl/nx-mcp?
io.github.nrwl/nx-mcp 是让 AI 助手直接操作你的 Nx 项目依赖和脚本的工具。
README
The UI for Monorepos, providing visual workflows and enriching your AI Chat with deep insights
Stay focused and productive right in your editor.
</div> <hr> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/nx-console-ui-dark.png"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/nx-console-ui-light.png" width="100%"> </picture>Why Nx Console?
Developers use both command-line tools and user interfaces. They commit in the terminal, but resolve conflicts in Visual Studio Code or WebStorm. They use the right tool for the job.
Nx Console is that tool. It helps developers stay in the flow, provides visual workflows, enhances your AI chats and more.
Installation
You can download Nx Console from the following places:
- Nx Console for Visual Studio Code from the Visual Studio Marketplace.
- Nx Console for Visual Studio Code from the OpenVSX Registry
- Nx Console for JetBrains from the JetBrains Marketplace
Key Features
AI Enhancements
Nx Console enhances your editors AI features by providing relevant context to the large language models powering VSCode and Cursor. Automatically teach AI about your workspace architecture, generators and feed it up-to-date nx docs!
<p align="center"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-ai-dark.gif"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-ai.gif" width="100%"> </picture> </p>Nx Console comes with an MCP server for both, VSCode and Cursor.
You can also install the MCP server separately from the Nx Console extension via the nx-mcp NPM package. More about that here. Learn more in the Nx docs.
Project Details View
Nx Console provides seamless integration with the Project Details View (PDV). You can learn more about your project, the available tasks and detailed configuration information. With the PDV in Nx Console, you can run tasks or navigate the task graph with just a few clicks!
<p align="center"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-pdv-dark.gif"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-pdv.gif" width="100%"> </picture> </p>Learn more about the Project Details view on nx.dev
Generate UI
Nx Console makes it easier to run generators through our interactive Generate UI. It automatically parses the schema for any generator and provides autocomplete, validation and dry-run previews as you type.
<p align="center"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-generate-ui-dark.gif"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-generate-ui.gif" width="100%"> </picture> </p>You can launch the Generate UI via the Nx: Generate (UI) command or through the context menu in the file explorer. Paths will be automatically prefilled! Learn more about the Generate UI on nx.dev
Nx Cloud Integration
Nx Console improves the experience of using Nx Cloud by giving you an overview of current CI Pipeline Executions and showing notifications when CI is done or an error occurs. No more refreshing GitHub forever, just keep working and Nx Console will let you know once your PR is ready!
<p align="center"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-cloud-dark.gif"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-cloud.gif" width="100%"> </picture> </p>Additionally, Nx Console helps by guiding you through the Nx Cloud onboarding process, right in your editor.
Learn more about the Nx Cloud Integration on nx.dev
Projects & Tasks Overview
Nx Console presents an overview of your workspace from an Nx perspective. You can browse projects, their targets & configurations in the Projects view. Run available targets or create shortcuts for frequent commands in the Common Nx Commands view.
Workspace Visualization
Nx Console visualizes the Nx project & task graphs right in your editor. It knows which file you're working on, so you can easily open the graph focused on that specific project. Also, with the tight integration into your editor, you can run tasks or explore the files that cause project dependencies with a single click.
<p align="center"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-graph-dark.gif"> <img alt="Nx Console - The UI for Nx & Lerna" src="https://raw.githubusercontent.com/nrwl/nx-console/master/static/demo-graph.gif" width="100%"> </picture> </p>Requirements
To use Nx Console, make sure you're in an Nx or Lerna workspace and have Node.js installed. If you're not using Nx yet, learn more here: Intro to Nx
You can create an Nx workspace by running the following command:
npx create-nx-workspace@latest my-workspace
To install Nx into an existing repository, simply run
npx nx init
Compatibility
The latest version of Nx Console supports all Nx versions starting at Nx 15. For older versions, we cannot guarantee compatibility or full functionality. However, we welcome contributions! If you encounter specific issues with older versions, please consider submitting a PR. Of course, if you discover any problems with newer versions of Nx, please report these issues to help us improve Nx Console.
If you're looking to upgrade your version of Nx easily, refer to the Nx migrate documentation.
Contributing
Please read the contributing guidelines. Pick one of the issues from the good first issue list to get started.
Learn More
- Documentation - Official documentation with video tutorials
- nx.dev - Documentation, Guides and Interactive Tutorials on Nx
- Join the community - Chat about Nx & Nx Console on the official discord server
- Learn more about the team at Nx - The team at Nx led the development of Nx Console, after working with many Enterprise clients.
Jetbrains WSL support
The Node interpreter under Languages & Frameworks > Node.js needs to be configured to use the Node executable within the WSL distribution. You can read more on the official Jetbrains docs page.
常见问题
io.github.nrwl/nx-mcp 是什么?
A Model Context Protocol server implementation for Nx
相关 Skills
前端设计
by anthropics
面向组件、页面、海报和 Web 应用开发,按鲜明视觉方向生成可直接落地的前端代码与高质感 UI,适合做 landing page、Dashboard 或美化现有界面,避开千篇一律的 AI 审美。
✎ 想把页面做得既能上线又有设计感,就用前端设计:组件到整站都能产出,难得的是能避开千篇一律的 AI 味。
网页构建器
by anthropics
面向复杂 claude.ai HTML artifact 开发,快速初始化 React + Tailwind CSS + shadcn/ui 项目并打包为单文件 HTML,适合需要状态管理、路由或多组件交互的页面。
✎ 在 claude.ai 里做复杂网页 Artifact 很省心,多组件、状态和路由都能顺手搭起来,React、Tailwind 与 shadcn/ui 组合效率高、成品也更精致。
网页应用测试
by anthropics
用 Playwright 为本地 Web 应用编写自动化测试,支持启动开发服务器、校验前端交互、排查 UI 异常、抓取截图与浏览器日志,适合调试动态页面和回归验证。
✎ 借助 Playwright 一站式验证本地 Web 应用前端功能,调 UI 时还能同步查看日志和截图,定位问题更快。
相关 MCP Server
GitHub
编辑精选by GitHub
GitHub 是 MCP 官方参考服务器,让 Claude 直接读写你的代码仓库和 Issues。
✎ 这个参考服务器解决了开发者想让 AI 安全访问 GitHub 数据的问题,适合需要自动化代码审查或 Issue 管理的团队。但注意它只是参考实现,生产环境得自己加固安全。
Context7 文档查询
编辑精选by Context7
Context7 是实时拉取最新文档和代码示例的智能助手,让你告别过时资料。
✎ 它能解决开发者查找文档时信息滞后的问题,特别适合快速上手新库或跟进更新。不过,依赖外部源可能导致偶尔的数据延迟,建议结合官方文档使用。
by tldraw
tldraw 是让 AI 助手直接在无限画布上绘图和协作的 MCP 服务器。
✎ 这解决了 AI 只能输出文本、无法视觉化协作的痛点——想象让 Claude 帮你画流程图或白板讨论。最适合需要快速原型设计或头脑风暴的开发者。不过,目前它只是个基础连接器,你得自己搭建画布应用才能发挥全部潜力。