說(shuō)實(shí)話第一次看到“Superpowers”這個(gè)擴(kuò)展名時(shí)我以為是某種給編輯器加特效的花架子。直到我用它寫(xiě)了兩個(gè)星期的業(yè)務(wù)代碼才意識(shí)到這玩意兒真正解決的是什么問(wèn)題它把你每天重復(fù)幾千次的瑣碎操作比如光標(biāo)跳轉(zhuǎn)、括號(hào)包裹、選中范圍、分號(hào)補(bǔ)齊壓縮成一組肌肉記憶級(jí)的快捷鍵。如果你最近在熱搜里刷到“superpowers 怎么用”“有哪些 skills”那多半是看到某個(gè)博主曬了一套行云流水的編碼動(dòng)圖。我不打算給你復(fù)述那些動(dòng)圖而是把這套擴(kuò)展的技能樹(shù)拆開(kāi)講清楚每個(gè)技能的設(shè)計(jì)邏輯、實(shí)際手感以及哪些鍵位綁定值得改、哪些坑必須避開(kāi)。這套擴(kuò)展適合誰(shuí)適合那種每天花大量時(shí)間在“刪括號(hào)、加逗號(hào)、移動(dòng)整行、選中參數(shù)”上的寫(xiě)代碼的人。如果你用的是 VS Code并且已經(jīng)受夠了原生態(tài)快捷鍵那種“一個(gè)操作要按三四個(gè)鍵”的挫敗感那這篇文章就是給你準(zhǔn)備的。1. 代碼操作的效率瓶頸未必在打字速度上很多人有個(gè)誤區(qū)覺(jué)得寫(xiě)代碼快就是打字快。但實(shí)際看下來(lái)真正拖慢節(jié)奏的從來(lái)不是輸入字母而是那些“結(jié)構(gòu)性操作”把光標(biāo)移動(dòng)到行尾、選中一個(gè)函數(shù)調(diào)用參數(shù)、給某段代碼包上括號(hào)、把兩個(gè)選擇區(qū)同時(shí)加逗號(hào)。這些操作在原生 VS Code 里不是不能做只是默認(rèn)鍵位太分散、太繞。比如想選一個(gè)函數(shù)調(diào)用原生是CtrlShift→一格一格挪挪完了還不一定選得準(zhǔn)。Superpowers 的核心思路就是把這些高頻微操作重新編排定義成一套有規(guī)律的組合鍵讓你在連續(xù)編碼時(shí)手指不需要大幅度移動(dòng)。這跟游戲里的“技能輪盤(pán)”是一個(gè)邏輯。你看魔獸世界的高手技能欄永遠(yuǎn)是圍繞左手位排布的絕對(duì)不會(huì)讓你為了放一個(gè)技能把手從 WASD 上挪開(kāi)。Superpowers 做的就是類(lèi)似的事把最常用的操作集中在相鄰鍵位上讓你在寫(xiě)代碼的“戰(zhàn)斗狀態(tài)”里不打斷節(jié)奏。1.1 先搞清楚它是誰(shuí)別裝錯(cuò)包先澄清一個(gè)容易踩的坑。如果你搜“superpowers”時(shí)不帶限定詞你會(huì)搜出一堆別的項(xiàng)目比如某個(gè) GitHub 倉(cāng)庫(kù)、某個(gè)終端工具、甚至一個(gè)寫(xiě)作軟件。我們這里討論的是 VS Code 市場(chǎng)里的擴(kuò)展擴(kuò)展 ID 是sbaldec.superpowers作者是 sbaldec。安裝的時(shí)候認(rèn)準(zhǔn)這個(gè)名字裝錯(cuò)了后續(xù)所有鍵位都對(duì)不上。另外一個(gè)容易混淆的點(diǎn)是它和“VS Code 內(nèi)置多光標(biāo)”的區(qū)別。內(nèi)置多光標(biāo)當(dāng)然能搞定不少事但 Superpowers 勝在操作編排的連貫性。比如它在粘貼時(shí)能自動(dòng)拆分光標(biāo)到每一行這是原生功能需要額外設(shè)置才能接近的效果。它不是一個(gè)“替代品”而是對(duì)編輯器原生能力的重新編排和強(qiáng)化。1.2 為什么叫“技能包”而不是“快捷鍵包”開(kāi)發(fā)者把它的功能稱(chēng)為“skills”這個(gè)措辭很講究。快捷鍵包只是告訴你“這個(gè)鍵干什么”技能包則強(qiáng)調(diào)“這組操作適合什么場(chǎng)景”。同樣是CtrlShift;在不同上下文里它可能是“自動(dòng)補(bǔ)分號(hào)”也可能是“打開(kāi)技能菜單”完全取決于你的光標(biāo)位置。這種設(shè)計(jì)理念是場(chǎng)景驅(qū)動(dòng)而不是鍵位驅(qū)動(dòng)。你不需要記住每個(gè)組合鍵對(duì)應(yīng)什么功能而是記住“我想做什么動(dòng)作”然后手指自然按下那個(gè)組合。這個(gè)思維轉(zhuǎn)換很重要不然你會(huì)在學(xué)習(xí)階段就被一堆快捷鍵表勸退。2. 安裝和初始配置照著抄就行安裝本身沒(méi)什么好說(shuō)的打開(kāi) VS Code進(jìn)擴(kuò)展面板搜“Superpowers”認(rèn)準(zhǔn)那個(gè)藍(lán)色閃電圖標(biāo)點(diǎn)安裝。裝完之后立刻重啟一次編輯器因?yàn)檫@擴(kuò)展要注入一些編輯器級(jí)別的命令不重啟有時(shí)候會(huì)出現(xiàn)鍵位不生效的情況。裝好之后不要急著用先做三件事。第一打開(kāi)快捷鍵面板CtrlK CtrlS搜“superpowers”大概看一遍默認(rèn)鍵位綁定至少做到眼熟。第二確認(rèn)你的鍵盤(pán)布局如果你用的是非美式鍵盤(pán)某些默認(rèn)組合可能會(huì)沖突尤其是分號(hào)和引號(hào)鍵位。第三先建一個(gè)臨時(shí)文件把下面的初始設(shè)置貼進(jìn) settings.json 再開(kāi)始體驗(yàn)這是我調(diào)整過(guò)幾輪的配置。superpowers.differentiateSkillsWhenWhitespacePresent: true, superpowers.enableSplitCursorsOnPaste: true, superpowers.enableCaretAnimation: true, superpowers.customKeybindings:disabled: false }這里重點(diǎn)解釋兩個(gè)配置項(xiàng)。differentiateSkillsWhenWhitespacePresent打開(kāi)之后當(dāng)光標(biāo)處于空白區(qū)域時(shí)技能會(huì)切換到“移動(dòng)/選擇”模式這個(gè)設(shè)定很貼合實(shí)際編碼場(chǎng)景。enableSplitCursorsOnPaste是精髓后面講選擇增強(qiáng)時(shí)會(huì)細(xì)說(shuō)。至于enableCaretAnimation純屬個(gè)人偏好它會(huì)讓光標(biāo)移動(dòng)帶一點(diǎn)動(dòng)畫(huà)效果視覺(jué)上能幫你確認(rèn)操作有沒(méi)有命中習(xí)慣后關(guān)掉也行。2.1 看看默認(rèn)鍵位心里有個(gè)底默認(rèn)鍵位有很多組但真正高頻的是這幾個(gè)Ctrl;是自動(dòng)追加分號(hào)CtrlShift;是打開(kāi)技能菜單CtrlShift,是給選區(qū)包括號(hào)CtrlShift8是循環(huán)切換括號(hào)類(lèi)型Alt↑/↓是數(shù)字遞增遞減。這組鍵位在設(shè)計(jì)上明顯考慮了左手主鍵區(qū)覆蓋了最常見(jiàn)的操作場(chǎng)景。我在第一輪使用時(shí)長(zhǎng)按慣例把能改的全改了一遍后來(lái)發(fā)現(xiàn)大多數(shù)默認(rèn)鍵位其實(shí)不用動(dòng)。真正需要改的是跟系統(tǒng)或原編輯器沖突的那些比如 macOS 上CmdShift,會(huì)跟系統(tǒng)偏好設(shè)置沖突Windows 上CtrlShift8在某些輸入法里會(huì)被攔截。這類(lèi)問(wèn)題等用到時(shí)再調(diào)就行沒(méi)必要開(kāi)箱就折騰。2.2 初始學(xué)習(xí)曲線先捆綁三招Superpowers 的完整技能很多但如果一上來(lái)就全盤(pán)接受你的大腦會(huì)過(guò)載。我建議按“三招原則”來(lái)第一周只練分號(hào)、括號(hào)包裹、刪除整行這三招能覆蓋大概三成的高頻操作第二周再把選擇增強(qiáng)和數(shù)字遞增加進(jìn)來(lái)第三周用技能菜單里的冷門(mén)技能補(bǔ)齊最后的需求。這跟健身一個(gè)道理你不可能一天練完全身肌肉。Superpowers 的優(yōu)勢(shì)在于每個(gè)技能單拎出來(lái)都不難難的是組合成肌肉記憶。循序漸進(jìn)地引入不僅不容易棄坑還能讓你對(duì)每個(gè)技能的適用場(chǎng)景有更深的體感。3. 核心技能逐個(gè)拆解每個(gè)操作都在解決什么當(dāng)有人問(wèn)你“Superpowers 具體有哪些 skills”不要甩給他一張快捷鍵速查表那樣沒(méi)意義。更好的回答方式是告訴他這套擴(kuò)展解決的是幾類(lèi)問(wèn)題——結(jié)構(gòu)插入、結(jié)構(gòu)包裹、選擇擴(kuò)展、數(shù)值調(diào)整、注釋切換。下面我按這個(gè)分類(lèi)逐個(gè)拆解。3.1 分號(hào)與逗號(hào)的自動(dòng)插入告別光標(biāo)反復(fù)橫跳先說(shuō)最直觀的自動(dòng)分號(hào)。你用Ctrl;它會(huì)在當(dāng)前行代碼的末尾自動(dòng)補(bǔ)一個(gè)分號(hào)無(wú)論光標(biāo)在什么位置都會(huì)聰明地跳過(guò)字符串內(nèi)容、注釋內(nèi)容和已經(jīng)以分號(hào)結(jié)尾的行。這個(gè)操作的本質(zhì)是“結(jié)構(gòu)插入”它幫你省掉了“跳到行尾—按分號(hào)—跳回來(lái)”的三步動(dòng)作。這個(gè)場(chǎng)景有多頻繁寫(xiě)過(guò) JavaScript 的人心里都有數(shù)。更妙的是在擴(kuò)展技能菜單里還有一個(gè)“Insert Semicolons While IntelliSense Visible”選項(xiàng)意思是代碼補(bǔ)全浮窗還開(kāi)著的時(shí)候你按下Ctrl;它會(huì)把當(dāng)前選中的補(bǔ)全項(xiàng)先接受再補(bǔ)分號(hào)一步到位。逗號(hào)的自動(dòng)插入則是另一個(gè)高頻殺手。寫(xiě)數(shù)組、對(duì)象、函數(shù)參數(shù)時(shí)光標(biāo)在項(xiàng)與項(xiàng)之間來(lái)回移動(dòng)補(bǔ),是常態(tài)而CtrlShift,就能把這事簡(jiǎn)化成一次按鍵。別忘了在配置里打開(kāi)differentiateSkillsWhenWhitespacePresent這樣在空白處按鍵會(huì)變成選中或移動(dòng)邏輯不會(huì)誤插入逗號(hào)。3.2 括號(hào)包裹與循環(huán)切換選區(qū)的“變形記”Superpowers 另一個(gè)讓我上癮的技能是括號(hào)包裹。選中代碼后按CtrlShift,它會(huì)彈出一個(gè)小輸入框讓你輸入括號(hào)類(lèi)型輸入后自動(dòng)在選區(qū)頭尾加上。這里有個(gè)細(xì)節(jié)在輸入框里你輸一個(gè)(它不只是給你加圓括號(hào)還會(huì)自動(dòng)補(bǔ)全另一半并且如果你輸入的是一對(duì)符號(hào)比如[]它也能識(shí)別不給你嵌套出亂碼。更實(shí)用的其實(shí)是括號(hào)類(lèi)型循環(huán)切換。選中一段用圓括號(hào)包著的代碼按CtrlShift8它會(huì)自動(dòng)切換成方括號(hào)再按一次變花括號(hào)。這個(gè)技能在改調(diào)用簽名時(shí)特別舒服比如把foo(bar)改成foo[bar]幾秒鐘的事不需要手動(dòng)刪括號(hào)再打括號(hào)。不過(guò)這個(gè)操作有個(gè)細(xì)節(jié)要留神它對(duì)“外層包圍符號(hào)”的識(shí)別需要光標(biāo)在括號(hào)內(nèi)側(cè)或選區(qū)包含完整括號(hào)時(shí)才穩(wěn)定。如果選區(qū)只選中了括號(hào)里的內(nèi)容那它可能理解成“切換內(nèi)容兩端的包裹符”結(jié)果并不總是你想要的。記住一句口訣先選整個(gè)括號(hào)表達(dá)式再按循環(huán)切換通常都對(duì)。3.3 選擇增強(qiáng)的底層邏輯智能分列位“Split Cursors on Paste”是 Superpowers 里含金量極高的隱藏技能。當(dāng)你復(fù)制多行文本然后把光標(biāo)放在某一行上按粘貼它會(huì)把粘貼內(nèi)容按行拆分并將光標(biāo)自動(dòng)放到每一行的行首或行尾相當(dāng)于一次粘貼就變成多光標(biāo)編輯狀態(tài)。舉個(gè)例子你有一列 id復(fù)制了三個(gè)數(shù)字然后選中三行前面對(duì)應(yīng)的位置執(zhí)行粘貼數(shù)字會(huì)分別落到每一行同時(shí)每個(gè)行尾自動(dòng)出現(xiàn)一個(gè)光標(biāo)。這時(shí)候你再輸入,三行同時(shí)補(bǔ)上逗號(hào)再按End跳到行尾繼續(xù)操作整個(gè)過(guò)程行云流水。原生 VS Code 當(dāng)然也能做類(lèi)似操作但需要你手動(dòng)AltClick插多個(gè)光標(biāo)高下立判。選擇增強(qiáng)的第二層是“列模式做加法”。當(dāng)你用多光標(biāo)選中了多段文本按CtrlShift↑/↓可以在每個(gè)光標(biāo)位置進(jìn)行數(shù)字遞增或遞減。這功能聽(tīng)起來(lái)小眾但一旦你開(kāi)始寫(xiě)測(cè)試數(shù)據(jù)、批量改序號(hào)、生成示例數(shù)組就會(huì)發(fā)現(xiàn)省下的時(shí)間非?？捎^。3.4 數(shù)字遞增遞減和數(shù)組輪換細(xì)節(jié)里的魔法數(shù)字遞增和遞減用Alt↑/↓部分版本是CtrlShiftAlt↑/↓就能實(shí)現(xiàn)。它不僅僅支持個(gè)位數(shù)步長(zhǎng)還能識(shí)別小數(shù)、負(fù)數(shù)、甚至二進(jìn)制數(shù)列。更聰明的是它能根據(jù)你選中的內(nèi)容自動(dòng)判斷在哪個(gè)數(shù)位上進(jìn)行增減選整個(gè)數(shù)字就整體增減選個(gè)位段就只在個(gè)位段上加減。數(shù)組輪換是另一個(gè)被低估的技能。它的作用是讓你在多選光標(biāo)之間循環(huán)移動(dòng)文本內(nèi)容比如你選中了三行內(nèi)容按一下輪換鍵第一行的內(nèi)容跑到第二行第二行的跑到第三行第三行的填充回第一行。這個(gè)功能在處理列表重排、交換變量順序時(shí)有奇效。輪換鍵在默認(rèn)設(shè)置下我也記不太清是哪個(gè)因?yàn)榇_實(shí)不常用需要的時(shí)候直接打開(kāi)技能菜單搜“rotate”更快。這本身也說(shuō)明了 Superpowers 一個(gè)設(shè)計(jì)哲學(xué)并非所有技能都要綁定快捷鍵偶爾用一次的功能就交給菜單去承載。3.5 列的復(fù)制粘貼與大小寫(xiě)變換細(xì)節(jié)控的福音列復(fù)制粘貼這塊Superpowers 做得比原生的“AltShift拖動(dòng)”更順滑。它能記住你上一次執(zhí)行列操作的列寬下次再觸發(fā)時(shí)可以按相同列寬快速操作不用每次拖動(dòng)。處理對(duì)齊的表格、日志輸出、批量注釋時(shí)這個(gè)記憶功能特別省心。大小寫(xiě)變換則是一個(gè)被埋沒(méi)的技能。選中變量名后可以通過(guò)技能菜單一次性完成 camelCase、PascalCase、snake_case、kebab-case 的互相轉(zhuǎn)換。雖然 VS Code 里有單獨(dú)的轉(zhuǎn)換命令但 Superpowers 把它們打包成菜單省得你逐個(gè)記憶擴(kuò)展命令名。3.6 注釋切換的細(xì)微差別注釋切換是另一個(gè)意想不到的亮點(diǎn)。普通編輯器切換注釋就是Ctrl/一行行切換Superpowers 則有兩種模式第一種是常見(jiàn)行注釋切換第二種是“切換并用縮進(jìn)注釋”的模式。后者可以在行內(nèi)注釋和塊注釋之間做更精細(xì)的控制處理調(diào)試標(biāo)記和臨時(shí)代碼時(shí)非常稱(chēng)手。我經(jīng)常用這個(gè)技能來(lái)臨時(shí)禁用某段代碼而不是直接刪除。在調(diào)試 bug 時(shí)Suspend 一段代碼往往比注釋一堆行更直觀Superpowers 的拖放和臨時(shí)禁用技能在這種場(chǎng)景下簡(jiǎn)直像為調(diào)試量身定制。4. 那些容易被忽略的隱藏技能除了前面這些高頻技能Superpowers 還藏了不少冷門(mén)但有用的操作。它們可能不是每天用但關(guān)鍵時(shí)刻能救急。比如它能按字母順序排序選區(qū)內(nèi)的行這在整理 import 列表、按字典序排列配置項(xiàng)時(shí)很香。選中幾行調(diào)出技能菜單搜“sort”一下就給你排好。另一個(gè)隱藏技能是“小寫(xiě)化與轉(zhuǎn)成標(biāo)題”。它可以把選中的字符串快速統(tǒng)一成小寫(xiě)、大寫(xiě)或標(biāo)題格式。寫(xiě)文檔、改注釋、調(diào)整枚舉值格式時(shí)很實(shí)用。還有一個(gè)技能叫“wrap with block cursor”它能在你的光標(biāo)位置創(chuàng)建一個(gè)塊級(jí)選區(qū)適合在代碼塊的外側(cè)快速標(biāo)記范圍。隱藏技能里最讓我驚喜的是“paste from clipboard history”——它直接讀取系統(tǒng)剪貼板歷史進(jìn)行多次粘貼選擇。這個(gè)原本需要裝第三方剪貼板工具Superpowers 直接集合進(jìn)了技能菜單。雖然剪貼板歷史有長(zhǎng)度限制但臨時(shí)用一下足夠方便。如果你想知道某個(gè)功能的觸發(fā)方式不用翻文檔直接打開(kāi)技能菜單搜索功能關(guān)鍵詞它會(huì)列出所有匹配命令。Superpowers 這個(gè)菜單本身就是探索工具我會(huì)隔一段時(shí)間就把菜單從 a 到 z 掃一遍每次都能摸到幾個(gè)之前沒(méi)注意的功能。4.1 如何自己發(fā)現(xiàn)更多技能把擴(kuò)展裝好之后最好的探索方式是打開(kāi)命令面板CtrlShiftP輸入“Superpowers”看它到底注冊(cè)了多少命令。你會(huì)發(fā)現(xiàn)有些命令根本沒(méi)有默認(rèn)快捷鍵需要你手動(dòng)綁定。這時(shí)你可以按自己的習(xí)慣把常用的操作掛到順手的組合鍵上。其次在擴(kuò)展設(shè)置里把superpowers.showOutdatedSkillsHint關(guān)掉可以避免一些老版本提示的干擾讓菜單更干凈。我自己就喜歡把這個(gè)提示關(guān)掉界面清爽很多。5. 常見(jiàn)問(wèn)題與排查技巧實(shí)錄從社區(qū)和自身踩坑來(lái)看Superpowers 使用中的問(wèn)題主要集中在鍵位沖突、技能不生效、和特定語(yǔ)言環(huán)境的兼容性上。這里我整理幾個(gè)高頻問(wèn)題按實(shí)際情況給出排查順序。5.1 快捷鍵沒(méi)反應(yīng)先查這三件事第一件事確認(rèn)擴(kuò)展已啟用且編輯器已重啟Superpowers 在安裝后不重啟部分命令可能沒(méi)有注入癥狀就是“看起來(lái)能用但按快捷鍵沒(méi)反應(yīng)”。第二步打開(kāi)快捷鍵面板搜“superpowers”檢查你按的組合鍵是不是被其他擴(kuò)展覆蓋了頻率最高的是 Vim 擴(kuò)展和各類(lèi)輸入法。第三步看看當(dāng)前文件類(lèi)型是否被擴(kuò)展跳過(guò)極端情況下某些語(yǔ)言模式會(huì)禁用部分技能比如在純文本文件里括號(hào)包裹類(lèi)操作就不一定會(huì)觸發(fā)。如果三步都查過(guò)仍然無(wú)效直接禁用所有其他擴(kuò)展只保留 Superpowers再試一遍。如果這時(shí)候能用了那就是另一個(gè)擴(kuò)展搶占了鍵位用排除法一個(gè)個(gè)啟用快速定位嫌疑擴(kuò)展。我之前就遇到過(guò)一次 Flutter 擴(kuò)展里的某個(gè)調(diào)試命令把Ctrl;搶走了禁用之后瞬間恢復(fù)。5.2 鍵位沖突的系統(tǒng)級(jí)處理如果你的快捷鍵沖突來(lái)自操作系統(tǒng)或輸入法那就不是在 VS Code 里能解決的了。以 Windows 為例CtrlShift,可能被某些中文輸入法當(dāng)作標(biāo)點(diǎn)切換快捷鍵此時(shí)你需要再定義一個(gè)自己的組合鍵或者切換輸入法狀態(tài)。macOS 上則是CmdShift,與系統(tǒng)偏好設(shè)置強(qiáng)綁定建議從一開(kāi)始就避開(kāi)這個(gè)組合。遇到鍵位沖突我的做法是打開(kāi)keybindings.json手動(dòng)綁定幾個(gè)自己順手的替代組合。比如我把“給選區(qū)包括號(hào)”改成了CtrlShift9把“數(shù)組輪換”綁到了CtrlAltShiftR雖然不如默認(rèn)鍵位那么優(yōu)雅但能保證穩(wěn)定觸發(fā)。鍵位這東西最可靠的標(biāo)準(zhǔn)就是“我自己按著順不順手”。5.3 版本更新帶來(lái)的配置變化Superpowers 迭代速度不算慢偶爾會(huì)出現(xiàn)新版本改動(dòng)默認(rèn)鍵位或棄用某個(gè)舊技能的情況。我踩過(guò)的坑是某次更新后舊的superpowers.insertSemicolonAtEndOfLine被重新命名自定義鍵位里的引用失效導(dǎo)致快捷鍵無(wú)聲無(wú)息地消失。所以每次升級(jí)擴(kuò)展后花一分鐘打開(kāi)快捷鍵面板搜索“superpowers”重點(diǎn)看那些曾經(jīng)被自定義覆蓋的鍵位是否還正常。同時(shí)留意擴(kuò)展主頁(yè)的更新日志大型版本升級(jí)后通常會(huì)有幾條配置遷移提示千萬(wàn)別直接跳過(guò)。5.4 與 Emmet、Prettier 的協(xié)作關(guān)系Superpowers 和 Emmet 之間偶爾會(huì)有快捷鍵重疊因?yàn)閮烧叨即罅空加肅trlShift組合鍵。我的建議是給 Emmet 的展開(kāi)縮寫(xiě)保留Tab其余 Emmet 的CtrlShiftP之類(lèi)的手動(dòng)觸發(fā)避免和 Superpowers 的選擇類(lèi)技能互踩。Prettier 這邊反而問(wèn)題不大。因?yàn)?Prettier 是保存時(shí)自動(dòng)格式化而 Superpowers 是輸入時(shí)的即時(shí)操作兩者分工明確。唯一要注意的是若你開(kāi)啟了“保存時(shí)修復(fù)”Superpowers 補(bǔ)好的分號(hào)在保存時(shí)可能會(huì)被 ESLint 規(guī)則改掉這不沖突只是格式化帶來(lái)的正常變化。5.5 調(diào)試場(chǎng)景里的特別用法Superpowers 在調(diào)試場(chǎng)景下也有一些好用的技能組合。比如臨時(shí)禁用代碼塊快速給表達(dá)式加 console.log 外殼或者用多光標(biāo)批量修改變量名。它的“臨時(shí)禁用”技能不是刪代碼而是像在代碼塊外層包一層注釋方便你在調(diào)試時(shí)反復(fù)啟用和禁用比手工注釋高效多了。調(diào)試多行日志時(shí)我經(jīng)常用列粘貼技能把同一份數(shù)據(jù)快速?gòu)?fù)制到多個(gè)日志點(diǎn)然后用數(shù)字遞增給每個(gè)日志點(diǎn)編號(hào)。這樣能從日志頻率上直接定位問(wèn)題發(fā)生順序幫我在復(fù)雜邏輯里節(jié)省了不少排查時(shí)間。6. 實(shí)操建議從安裝到融入日常的開(kāi)發(fā)流如果你決定開(kāi)始用 Superpowers我建議不要把它當(dāng)成“又一套快捷鍵”去背而是把它當(dāng)成一種新的編碼姿勢(shì)來(lái)適應(yīng)。姿勢(shì)的養(yǎng)成依賴(lài)重復(fù)重復(fù)需要場(chǎng)景驅(qū)動(dòng)。你可以在接下來(lái)的一周里每寫(xiě)一段代碼前想一個(gè)問(wèn)題“剛才那個(gè)操作會(huì)不會(huì)有更快的技能能實(shí)現(xiàn)”然后主動(dòng)打開(kāi)技能菜單搜一下。6.1 用“小步快跑”的方式推進(jìn)訓(xùn)練第一周只練分號(hào)、括號(hào)包裹、刪除整行。第二周加選擇增強(qiáng)和數(shù)字遞增。第三周探索隱藏技能菜單。這個(gè)節(jié)奏的核心原因是避免認(rèn)知過(guò)載每個(gè)技能都要練到形成條件反射為止否則關(guān)鍵時(shí)刻你還會(huì)下意識(shí)按舊快捷鍵新技能永遠(yuǎn)“想不起來(lái)用”。我個(gè)人的體會(huì)是不要追求“今天學(xué)會(huì)全部技能”那是表演型學(xué)習(xí)不是工程型學(xué)習(xí)。工程型學(xué)習(xí)要求你將一個(gè)技能打磨到“不需要思考”的地步再進(jìn)入下一個(gè)。Superpowers 的技能數(shù)量不少但值得進(jìn)入“條件反射層”的其實(shí)也就十幾個(gè)。6.2 把快捷鍵配置納入團(tuán)隊(duì)規(guī)范如果團(tuán)隊(duì)里有幾個(gè)同事也在用 VS CodeSuperpowers 完全可以納入團(tuán)隊(duì)開(kāi)發(fā)的效率規(guī)范。把推薦配置和自定義鍵位寫(xiě)進(jìn)項(xiàng)目的.vscode/recommended extensions和settings.json新人克隆項(xiàng)目后就能同步獲得這套操作加強(qiáng)。這比口頭安利有效得多。不過(guò)要注意自定義鍵位文件keybindings.json是用戶級(jí)的無(wú)法通過(guò)項(xiàng)目倉(cāng)庫(kù)直接分享。你可以用一份文檔記錄推薦鍵位映射然后讓團(tuán)隊(duì)同事手動(dòng)導(dǎo)入。別試圖用任務(wù)自動(dòng)化去改同事的鍵盤(pán)映射那體驗(yàn)就是“我改了你電腦”很容易引起反感。6.3 推薦配置清單最后分享一份我目前正在用的配置絕對(duì)不會(huì)讓你失望。把它放在你的 settings.json 里體驗(yàn)一下然后根據(jù)自己的習(xí)慣微調(diào)。superpowers.differentiateSkillsWhenWhitespacePresent: true, superpowers.enableSplitCursorsOnPaste: true, superpowers.enableCaretAnimation: true, superpowers.showOutdatedSkillsHint: false, superpowers.dragAndDropEnabled: true, editor.multiCursorModifier: ctrlCmd, editor.formatOnPaste: true, editor.formatOnSave: true }dragAndDropEnabled打開(kāi)后可以直接拖動(dòng)選區(qū)到另一個(gè)位置實(shí)現(xiàn)類(lèi)似“移動(dòng)代碼塊”的拖拽操作。editor.multiCursorModifier設(shè)置成ctrlCmd是為了讓多光標(biāo)操作和 Superpowers 的選擇增強(qiáng)更好地協(xié)同工作避免模塊覆蓋。editor.formatOnPaste和formatOnSave則是我個(gè)人偏好的規(guī)范化習(xí)慣建議根據(jù)你項(xiàng)目的 Prettier 配置決定是否開(kāi)啟。6.4 它不能幫你做什么最后說(shuō)句公道話。Superpowers 并不改變你的代碼設(shè)計(jì)能力也不能替你重構(gòu)爛代碼它的價(jià)值集中在“手速”和“流暢度”這個(gè)維度。如果你連代碼結(jié)構(gòu)都沒(méi)想清楚用再快的鍵位也只會(huì)讓你更快地寫(xiě)出錯(cuò)誤代碼。它提升的是執(zhí)行效率而不是思維效率。所以理想的使用姿勢(shì)是先把代碼邏輯在腦子里理清楚再讓 Superpowers 幫你用最低的摩擦把想法落到編輯器里。工具能放大效率但前提是你得先有內(nèi)容可放大。我在實(shí)際使用中最滿意的一個(gè)變化是寫(xiě) JavaScript 時(shí)“分號(hào)補(bǔ)全—括號(hào)包裹—數(shù)字遞增”這條連招很多時(shí)候剛寫(xiě)完一行邏輯順手補(bǔ)分號(hào)、選個(gè)表達(dá)式包起來(lái)、批量改幾個(gè)數(shù)字一氣呵成再也不用停下來(lái)琢磨“剛才那個(gè)鍵是什么”。這種感覺(jué)一旦嘗到你就回不去了。