本文來分享 10 個極大提高開發(fā)效率的 VS Code 技巧！在VS Code中，可以在設(shè)置中搜索" Editor: Wrap Tabs"來實(shí)現(xiàn)選項(xiàng)卡換行的功能。
本文來分享 10 個極大提高開發(fā)效率的 VS Code 技巧！
標(biāo)簽換行
在VS Code中，可以在設(shè)置中搜索" Editor: Wrap Tabs"來實(shí)現(xiàn)選項(xiàng)卡換行的功能。
這樣，在大型項(xiàng)目中工作時(shí)，就不需要像在瀏覽器中一樣滾動來查找選項(xiàng)卡，而是可以讓選項(xiàng)卡自動換行，更方便地跟蹤模板和組件。
Timeline 視圖：本地源代碼控制
Git等代碼控制工具能夠輕松跟蹤文件的變更，并且在需要時(shí)還原到之前的狀態(tài)。為了提供更好的版本控制和代碼歷史的可視化，VS Code提供了Timeline視圖。
Timeline視圖是一個自動更新的面板，它顯示與文件相關(guān)的重要事件，如Git提交、文件保存和測試運(yùn)行等。通過Timeline視圖，你可以更直觀地瀏覽代碼的演變過程，追蹤各種操作對文件的影響。
展開此視圖可查看與當(dāng)前文件相關(guān)的事件快照列表。這里是文件保存，也是 Git 提交文件暫存的地方。
將鼠標(biāo)懸停在快照項(xiàng)上可查看 VS Code 制作快照的日期和時(shí)間。
選擇快照項(xiàng)可查看差異視圖，顯示快照時(shí)的文件與當(dāng)前文件之間的更改。
自定義布局
VS Code 界面的左側(cè)選項(xiàng)卡通常包括資源管理器、搜索、源代碼控制、項(xiàng)目管理等功能。而終端中會顯示諸如 “problems”, “output”, “terminal”和“debug console”等工具欄。
VS Code 支持自由地拖放這些選項(xiàng)卡，按照喜好來重新排列界面，讓它更適合你的使用習(xí)慣。
通過簡單的拖拽操作，可以改變它們的位置。比如，可以將資源管理器移到右側(cè)，將搜索放在頂部，或者將終端移動到左側(cè)。只需點(diǎn)擊選項(xiàng)卡的標(biāo)題欄，并將其拖動到你想要的位置。釋放鼠標(biāo)按鈕后，選項(xiàng)卡將會被放置在你選擇的位置上，可以更方便地訪問和管理這些功能。
自動保存
在編輯文件時(shí)，默認(rèn)情況下需要手動保存文件，比如按下Ctrl + S快捷鍵。這個過程可能很麻煩，特別是當(dāng)頻繁修改文件時(shí)。為了減輕這種繁瑣的操作，VS Code 引入了自動保存功能。
自動保存功能會在我們進(jìn)行文件編輯時(shí)自動保存文件的更改，而無需手動按下保存快捷鍵。這意味著我們可以專注于寫代碼而不用擔(dān)心保存文件，節(jié)省了不少時(shí)間和精力。此外，自動保存還確保我們始終使用的是最新的文件版本，避免了由于未及時(shí)保存而丟失修改的情況。
使用“文件”>“自動保存”可以輕松啟用該功能。
然而，自動保存功能并非完美無缺。有些人可能喜歡手動控制保存的時(shí)機(jī)，以便在修改完成之前進(jìn)行檢查和確認(rèn)。自動保存也可能導(dǎo)致一些意外情況，比如誤操作或者意外修改了文件內(nèi)容，因?yàn)橐坏┍４妫薷木蜁⒓瓷А?/p>
是否啟用自動保存功能取決于個人偏好和實(shí)際需求。權(quán)衡利弊，根據(jù)自己的習(xí)慣和工作流程來決定是否使用自動保存功能。
使用命令面板執(zhí)行操作
在 VS Code 中，除了輸入文本之外，幾乎任何操作都可以通過命令面板完成。命令面板允許我們在編輯器中執(zhí)行各種任務(wù)，包括與文件相關(guān)的命令、導(dǎo)航命令、編輯命令和終端命令，每個命令都被優(yōu)化設(shè)計(jì)以提升編輯體驗(yàn)。通過命令面板，可以簡單地搜索所需的命令，并選擇執(zhí)行相應(yīng)的操作。
打開命令面板的方式如下：
- windows/linux: 使用快捷鍵 Ctrl + Shift + P
- mac: 使用快捷鍵 Shift + Command + P
快捷鍵是一種使用鍵盤更快地運(yùn)行命令的方式。與使用快捷鍵相比，命令面板的主要優(yōu)勢在于當(dāng)某個命令沒有快捷鍵時(shí)，或者當(dāng)你不確定某個命令是否存在時(shí)，可以通過命令面板進(jìn)行查找和執(zhí)行。
在 VS Code中，有大量的命令可供使用，比如打開文件、查找替換、調(diào)試應(yīng)用程序等。雖然很多命令都有對應(yīng)的快捷鍵，但并不是所有命令都有快捷鍵。此時(shí)，命令面板就發(fā)揮了作用。命令面板提供了一個搜索功能，可以輸入關(guān)鍵字來查找你想要執(zhí)行的命令。即使你不知道具體的命令名稱，只需輸入相關(guān)的描述性關(guān)鍵字，命令面板也能幫助你找到合適的命令。這種靈活性讓你無需記憶全部命令及其快捷鍵，只需用簡單的搜索即可找到所需的命令并執(zhí)行操作。
因此，命令面板是一個非常實(shí)用的工具，特別適合當(dāng)需要執(zhí)行沒有快捷鍵的命令，或者想查找你不確定是否存在的命令時(shí)使用。
新設(shè)備同步
當(dāng)在一臺電腦上設(shè)置好了自己喜歡的 VS Code 環(huán)境后，如果換了一臺新電腦，不想再重新配置一遍。這時(shí)，VS Code的設(shè)置同步功能就派上用場了。
通過設(shè)置同步功能，可以將一臺電腦上的所有配置都保存下來。然后，在新的電腦上登錄賬號，開啟設(shè)置同步功能，就可以讓新電腦應(yīng)用上與之前完全相同的設(shè)置。這樣，不需要再花時(shí)間重新調(diào)整和配置所有的設(shè)置了。
禁用預(yù)覽
在 VS Code 中，當(dāng)打開一個文件后，立即打開另一個文件而沒有編輯第一個文件時(shí)，第一個文件就會被替換掉。VS Code只是在選擇文件時(shí)預(yù)覽它們，所以一旦點(diǎn)擊另一個文件，之前的文件就會消失。
可以在設(shè)置中搜索“Editor: Enable Preview”，取消勾選即可。這樣，當(dāng)打開一個文件后，即使打開了另一個文件，之前的文件也會保留在編輯器中，而不會自動關(guān)閉。這樣，可以方便地在多個文件之間進(jìn)行切換和比較。
除此之外，如果想在某些情況下時(shí)預(yù)覽文件，而有些情況是固定文件。可以在 Tab 欄雙擊需要固定的文件，這樣這個文件就被固定了，不會被替換掉。
快速跳到代碼行
可以使用Ctrl + G 快捷鍵實(shí)現(xiàn)代碼行的快速跳轉(zhuǎn)。使用這個快捷鍵，會彈出一個輸入框，可以在其中輸入要跳轉(zhuǎn)的行號。輸入行號后，按回車鍵，編輯器將會直接跳轉(zhuǎn)到指定的行數(shù)處。這樣就能快速地導(dǎo)航到代碼的特定行，而不需要手動滾動查找。
平滑光標(biāo)打字
VS Code有一個稱為"平滑光標(biāo)"的功能，它可以在光標(biāo)移動時(shí)產(chǎn)生平滑的動畫效果。這讓打字感覺更加流暢和精致，并且在我們?yōu)g覽代碼行并將光標(biāo)放置在不同位置時(shí)，給予我們更平滑、更自然的感覺。
要打開平滑光標(biāo)功能，可以在命令面板中打開設(shè)置界面，并搜索 "Editor: Cursor Smooth Caret Animation" ，打開該設(shè)置即可。
多光標(biāo)編輯
多光標(biāo)編輯功能允許我們在不同的位置同時(shí)編輯多個光標(biāo)所在的文本，從而快速地進(jìn)行批量操作。例如，我們可以一次性在多行代碼中插入同樣的內(nèi)容，或者同時(shí)刪除多處重復(fù)的文本，以加快編輯的效率。
在編輯時(shí)，至少會有一個光標(biāo)，可以使用"Alt + 單擊"的方式添加更多的光標(biāo)。
還可以使用 Ctrl + Alt + Down 或 Ctrl + Alt + Up 快捷鍵輕松地在當(dāng)前行上方或下方添加光標(biāo)。
