斩获20w star:Claude Code最强插件 AI编程必备

superpowers简介

superpowers是目前最火的AI编程skill框架，可以为AI编程工具提供系统化的工作方法论，目前在Github上已有20w star！

superpowers中包括如下14个skill。

还有一个中文社区版项目superpowers-zh，除了包括上述skill外，还包括6个中国特色的skill。

安装

• 我们可以使用npm命令来安装，这里使用项目级别的安装方式；

# 先进入你的项目目录，不要在主目录（~）下运行cd /your/project# 安装中文版superpowersnpx superpowers-zh

• 安装完成后会自动在项目目录下创建.claude目录，并生成对应的skill文件；

• 如果你想卸载的话，可以使用如下命令。

npx superpowers-zh@latest --uninstall

使用

• 首先输入提示词：我想开发一个Markdown编辑器，Claude Code会调用brainstormingskill来帮助你理清需求；

• 这里有一个提供视觉伴侣的功能非常有意思，会开启一个页面服务，访问可以选择编辑器的布局；

• 选择好布局之后，Claude Code会让你选择编辑器运行在什么平台上；

• 之后会问你偏好哪种前端解决方案；

• 之后是让你选择功能边界，例如这个Markdown编辑器的主要用途是什么；

• 之后是数据存储的位置；

• 之后是让你选择你偏好的后端技术栈；

• 之后是让你选择你必须的Markdown编辑器功能；

• 需求明确之后，Claude Code还会问你一些关键问题，例如是否需要用户登陆注册功能；

• 之后还会让你选择技术方案，这里Claude Code提供了三种技术方案；

• 根据你选的技术方案，Claude Code还会通过视觉伴侣提供项目的整体架构图；

• 以及数据模型设计图；

• 还有前端页面布局图；

• 以及REST API设计；

• 还有项目结构与路由设计；

• 整体设计完成后，Claude Code还会编写完整的设计文档；

• 之后会调用writing-plansskill来创建实现计划；

• 具体实现计划如下，共拆分成了28个小任务，非常详细；

• 实现计划编写完成后，会让你选择是使用subagent-driven-developmentskill来进行功能开发，还是使用executing-plansskill；

• 经过一段时间的编码之后，Claude Code完成了整个实现计划；

• 如果你让Claude Code来运行前后端，并且安装了chrome-devtools的MCP的话，它还会帮你跑一遍页面测试；

• 最终开发完成的Markdown编辑器效果如下，还是挺炫酷的！

注意点

• 在整个开发过程中Claude Code使用了superpowers中的三个skill；

• test-driven-development并没有显式调用，只是在开发计划里有部分TDD的使用；

• 还有就是为什么要通过subagent-driven-development开启subagent来开发功能，主要是为了上下文隔离。

总结

今天给大家分享了Claude Code+superpowers的使用，superpowers确实功能非常强大，一句话的需求，经过brainstorming之后，给我们把需求整理得清清楚楚。它的视觉伴侣功能很不错，能直观描述系统的架构，大家可以对比下不装superpowers的开发体验，确实不一样了！

项目地址

• 原版：github.com/obra/superp…
• 中文版：github.com/jnMetaCode/…