親測 Superpowers 最強 AI Skill:遷移項目為 Element Plus 全程零翻車!

作者:可樂不是Code
日期:2026年4月18日 下午3:25
來源:WeChat 原文

整理版優先睇

速讀 5 個重點 高亮

Superpowers Skill 能夠將項目遷移過程拆解成多個決策點,大幅提升AI改程式嘅靠譜度。

整理版摘要

作者可樂係一個開發者,佢想用AI幫手將一個原本冇用UI框架嘅工時系統前端,遷移成 Element Plus,而且保持原有樣式。佢試咗一個叫 Superpowers 嘅 AI Skill,發現呢個工具唔係直接改程式,而係先停低問清楚目標,再逐項確認,最後先執行。

Superpowers 係由 Jesse VincentGitHub 用戶 obra)開發嘅開源項目,GitHub 上有約 15.8 萬 Stars。佢嘅運作方式係:當你啟用代碼智能體,佢偵測到你開發緊項目時,會先問你真正想實現嘅目標,梳理出清晰需求,再拆成簡短易讀嘅片段,等你確認設計後,先制定一份清晰嘅實施計劃。呢份計劃會跟紅/綠測試驅動開發(TDD)、唔做無用功(YAGNI)同代碼複用(DRY)原則。

可樂實際用 /brainstorming 指令,將前端改為 Element Plus。過程中AI自動掃描整個項目,讀取核心文件,然後逐步確認遷移節奏、優先級同範圍。仲提供咗三個技術方案,每個都分析咗優缺點。可樂覺得呢個Skill雖然冇令AI變聰明,但係比之前更加靠譜,減少咗好多意外。佢希望藉住AI幫手喺呢個月完成成個系統,並會繼續分享經驗。

  • Superpowers Skill 透過結構化提問同逐步確認,令AI項目遷移更穩陣,減少錯誤。
  • 使用 /brainstorming 指令,AI會先掃描項目、確認目標,再拆成步驟,唔會自作主張。
  • 比起直接叫AI改程式,呢個Skill會停低問清楚,避免一嚟就改錯嘢。
  • 複雜任務應該拆成細決策點,逐個確認先執行,呢個方法可以應用喺唔同開發場景。
  • 可以試用 npx skills find superpowers 安裝,然後對現有項目用 /brainstorming 做架構遷移。
值得記低
Skill github.com

Superpowers AI Skill

一個令AI開發更靠譜嘅Skill,透過結構化提問同逐步確認執行計劃,支援/brainstorming指令。

整理重點

咩係 Superpowers Skill?

Superpowers 係一個開源 AI Skill,由 Jesse Vincent 開發,GitHub 上有約 15.8 萬 Stars。佢嘅核心設計係:當你啟動代碼智能體,佢唔會即刻寫 Code,而係 先問清楚你嘅目標,再將需求拆成 簡短易讀嘅片段,等你確認先至執行。

整理重點

安裝同基本用法

安裝可以上官網跟步驟,或者直接用 npx skills find superpowers 嚟安裝。使用指令係 /brainstorming 再加提示詞。

  • 方式一:去 GitHub 項目睇安裝指引(https://github.com/obra/superpowers#installation)。
  • 方式二:用 npx skills find superpowers 一鍵安裝。
整理重點

實戰案例:遷移 Element Plus

可樂將一個工時系統前端由冇框架轉為 Element Plus,全程用 /brainstorming。AI 自動掃描項目,逐步確認:

  1. 1 第一步:確認遷移節奏,問你想一次過定逐步改。
  2. 2 第二步:確認遷移優先級,例如邊啲組件先改。
  3. 3 第三步:確認遷移範圍,畀你揀改曬定部分。

之後 AI 提供咗 三個技術方案,每個都詳細分析優缺點,例如保留原有樣式嘅方法。你可以逐個答,最後先執行改 Code

成個過程唔係直接改,而係逐步確認,減少錯漏

整理重點

使用體驗同反思

可樂覺得呢個Skill 冇令AI變聰明,但係更加靠譜,因為佢會 拆解複雜任務,令你每個步驟都知自己做緊乜。呢種方法對 項目遷移 呢類高風險改動特別有用。

佢仲總結:複雜任務應該 拆成細決策點,逐個確認先執行,呢個原則可以應用喺好多開發場景。

寫喺開頭

hi,我係可樂

今日我同大家推介一個 GitHub 項目,一個新嘅 skill:superpowers

圖片

項目介紹

GitHub 地址

https://github.com/obra/superpowers

項目詳情

⭐ Stars: 約 15.8 萬

🍴 Forks: 約 1.38 萬

👨‍💻 作者: Jesse Vincent(GitHub 用戶名: obra)

介紹

由你啟動程式智能體嗰一刻開始,佢就會運作。當佢察覺到你正在開發某個項目嗰陣,唔會即刻一頭栽入去寫程式,而係停低,問嚇你真正想達到嘅目標係乜。喺對話入面梳理出清晰嘅需求說明之後,佢會將內容拆分成簡短易明、方便理解嘅片段展示畀你。等你確認咗設計方案之後,智能體會制定一份清晰易明嘅實施計劃,就算係一個有熱情但審美一般、冇判斷力、唔瞭解項目背景、抗拒測試嘅初級工程師,都可以跟住執行。呢個計劃嚴格跟隨紅/綠測試驅動開發(TDD)、絕唔做冇用功(YAGNI)同埋程式碼複用原則(DRY)。

安裝方式

方式一:官方使用嘅安裝方式可以㩒呢條連結

https://github.com/obra/superpowers#installation

方式二:find-skill:

可以經 npx skills find superpowers 進行安裝。

使用方式:

/brainstorming + 提示詞

使用案例

我哋以之前嘅工時系統做例子,原本AI生成嘅前端項目,冇用到任何UI框架,而家我要將佢轉做 Element Plus,但係原本嘅樣式唔會改變。

開始使用

/brainstorming 梳理一下項目,我想把它的前端架構改為Element Plus

轉換嘅部分過程截圖如下:可以見到,同AI直接執行轉換相比,喺轉換之前會多咗更多次、更仔細嘅提問。

首先,自動掃描成個項目,讀取核心檔案,先搞清楚我到底有啲乜。而且一步一步確認,冇自作主張

圖片

將一個複雜嘅遷移任務,拆解成一個個需要我確認嘅決策點:

1)第一步:確認遷移節奏

2)第二步:確認遷移優先級

3)第三步:確認遷移範圍


圖片
圖片

圖片

畀咗三個唔同嘅技術方案,仲詳細分析咗每個嘅優缺點,我哋只需要跟住佢嘅提問嚟回答就得。

圖片

我覺得,呢個skill雖然冇令AI變得好聰明,但係比以前更加靠譜

寫喺最後

最近終於有時間搞呢個系統喇,呢個係我第一個淨係靠AI開發、幾乎冇手寫過嘅系統,希望藉助AI,喺呢個月入面可以做完呢個系統,我都會及時分享喺開發過程入面遇到嘅一啲踩坑經驗。

如果鍾意呢篇文章,歡迎點讚、轉發

我哋下期再見


寫在開頭

hi,我是可樂

今天我給大家推薦一個github項目,一個新的skill:superpowers

圖片

項目介紹

github地址

https://github.com/obra/superpowers

項目詳情

⭐ Stars: 約 15.8 萬

🍴 Forks: 約 1.38 萬

👨‍💻 作者: Jesse Vincent(GitHub 用戶名: obra)

介紹

從你啓動代碼智能體的那一刻起,它就開始運作了。當它察覺到你正在開發某個項目時,不會立刻一頭扎進代碼編寫,而是先停下來,詢問你真正想要實現的目標。 在對話中梳理出清晰的需求說明後,它會將內容拆分成簡短易讀、方便理解的片段展示給你。 待你確認設計方案後,智能體會制定一份清晰易懂的實施計劃,哪怕是一名熱情但審美一般、缺乏判斷力、不瞭解項目背景、牴觸測試的初級工程師,也能照着執行。該計劃嚴格遵循紅 / 綠測試驅動開發(TDD)、絕不做無用功(YAGNI)和代碼複用原則(DRY)。

安裝方式

方式一:官方使用的安裝方式可以跳轉如下連結

https://github.com/obra/superpowers#installation

方式二:find-skill:

可以通過 npx skills find superpowers 進行安裝。

使用方式:

/brainstorming + 提示詞

使用案例

我們以上次的工時系統為例,原本AI生成的前端項目,沒有使用任何的UI框架,現在我要把他轉為 Element Plus,但是原本的樣式不會發生改變。

開始使用

/brainstorming 梳理一下項目,我想把它的前端架構改為Element Plus

轉換的部分過程截圖如下:可以看到,相比於AI直接執行並轉換,在轉換之前會有更多次、更細緻的提問。

首先,自動掃描整個項目,讀取核心文件,先搞清楚我到底有什麼。而且一步一步確認,沒有自作主張

圖片

把一個複雜的遷移任務,拆解成了一個個需要我確認的決策點:

1)第一步:確認遷移節奏

2)第二步:確認遷移優先級

3)第三步:確認遷移範圍


圖片
圖片

圖片

給出了三個不同的技術方案,並且詳細分析了每一個的優缺點,我們只需要按照它的提問進行回答即可。

圖片

我感覺,這個skill雖然沒有讓AI變得很聰明,但是比之前更加靠譜

寫在最後

最近終於有時間折騰這個系統了,這是我第一個只靠AI開發,幾乎沒有手寫的系統,希望藉助AI,在這個月能把這個系統做完,我也會及時分享在開發過程中的一些踩坑經驗。

如果喜歡這篇文章,歡迎點贊、轉發

我們下期再見