详情

首页手游攻略 斩获20w star:Claude Code最强插件,AI编程必备!

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

佚名 2026-06-30 09:39:06

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/…
相关资讯
点击查看更多
游戏推荐
推荐专题
热门阅读
推荐下载