vscode 簡介

VS Code，全稱是Visual Studio Code，但因為全稱太長，微軟旗下另一款產品visual studio又經常被簡稱為VS，所以這款與vs有一定淵源的代碼編輯器就被簡稱為VSCode。

它是一個免費的、開源的跨平臺編輯器。之所以強調“編輯器”，我想是因為 VS Code 并無意成為一個全尺寸的集成開發(fā)環(huán)境，也就是IDE。

很多人都把編輯器等同于IDE，其實從專業(yè)角度來講并非這樣。IDE 更為關注開箱即用的編程體驗、對代碼往往有很好的智能理解，同時側重于工程項目，為代碼調試、測試、工作流等都有圖形化界面的支持，因此相對笨重，Java程序員常用的Eclipse定位就是IDE；而編輯器則相對更輕量，側重于文件或者文件夾，語言和工作流的支持更豐富和自由，VS Code 把自己定位在編輯器這個方向上，但又不完全局限于此。

如果你有興趣，可以打開自己喜歡的編輯器官網看看它是怎么樣的定位。總體來說，近幾年流行風向是輕量的編輯器，這也是大勢所趨。

要理解VS Code代碼編輯器的設計思路，就需要先看看VS Code的發(fā)展軌跡。從我的角度看，不管你是學習編程語言，還是框架、編輯器，都應該先去看看它的來龍去脈，了解它們是怎么發(fā)展而來的，曾經遇到了什么問題，又是怎么解決的，這些信息都便于你從大局上提高對事情本質的認識。

VSCode 發(fā)展歷史

2011 年底，微軟從 IBM 請來了 Erich Gamma。Erich Gamma 是《設計模式》一書的作者之一，曾和肯特·貝克（Kent Beck） 一起發(fā)明了 JUnit，并且在 IBM 領導 Java 開發(fā)工具的開發(fā)工作。微軟把他請過來，就是希望他能夠打造一款在線的開發(fā)工具，讓開發(fā)者們能夠在瀏覽器里獲得 IDE 般的開發(fā)體驗，這也就是之后為人所知的 Monaco Editor。

Erich Gamma 見證了 Eclipse 從崛起到逐漸臃腫，再逐漸式微的整個歷程，他深刻認識到 Eclipse 成功的一部分原因是極度的可定制化特性，任何功能在Eclipse中都可以用插件來實現(xiàn)；但是由于 Eclipse 的插件跟核心代碼運行在同一個進程內，隨著插件的增多，核心功能經常會被插件拖累，也就更加讓人覺得笨重。

因此，在打造 Monaco Editor 時，開發(fā)團隊非常注重核心功能的性能，盡可能地保持輕量，而對資源和性能消耗較大的功能，則運行在其他的進程之中。

2015 年，Erich Gamma 帶領團隊把 Monaco Editor 移植到桌面平臺上，也就是這個專欄的主角 Visual Studio Code，即 VS Code。

VS Code 繼承了 Monaco Editor 的設計原則，其核心是做一個高性能的輕量級編輯器；個性化的功能，則交給插件系統(tǒng)來完成。這一點可以說是師承 Eclipse，但同時又吸取了 Eclipse 的教訓，把插件系統(tǒng)運行在主進程之外，高度可定制但同時又是可控的。

與此同時，VS Code 也有自己的使命，那就是讓開發(fā)者在編輯器里擁有 IDE 那樣的開發(fā)體驗，比如對源代碼有智能的理解、圖形化的調試工具、版本管理等等。

不難發(fā)現(xiàn)，VS Code 希望在編輯器和 IDE 之間找到一個平衡。在這樣的設計思路下，你打開編輯器，不需要創(chuàng)建任何的項目工程文件就可以開始使用，并高效便捷地操作文本；同時在編程語言插件的支持下能夠得到語法檢查、智能提示；你還可以借助豐富的插件 API 拓展 VS Code 以滿足自己的需求。

要達成這樣的目標，難度可以說是非常大的，但 VS Code 取得了不錯的成果。究其原因，在我看來就是微軟打造了一個開放的平臺。雖然有“馬后炮”的嫌疑，但讓我們一起來看看這樣的一個開放平臺是怎么助力 VS Code 的吧。

VSCode 是開源與開放的平臺

首先，VS Code 的源代碼以 MIT 協(xié)議開源。這不僅意味著大家能夠免費獲取到 VS Code 的核心代碼，更意味著社區(qū)能夠基于 VS Code 的代碼，開發(fā)自己的產品。

業(yè)界現(xiàn)在比較知名的基于 VS Code 的項目有 SourceGraph、StackBlitz、CodeSandbox 等，這些產品可以提供非常接近VS Code 的開發(fā)體驗，而VS Code 也經常從它們身上吸取技術和產品層面的寶貴經驗。

其次，開發(fā)過程和反饋渠道的開放。 VS Code 源代碼托管在 GitHub 上，同時使用 GitHub 管理項目的開發(fā)計劃和測試，每個用戶都可以在 GitHub 上了解到 VS Code 的開發(fā)進度。與此同時，GitHub 也是 VS Code 唯一的反饋渠道，開發(fā)團隊根據(jù)反饋的影響程度進行統(tǒng)籌安排。作為用戶，你可以近乎實時地跟開發(fā)團隊進行交流，了解產品的發(fā)展情況。

再次，接口的開放。VS Code 自帶了 TypeScript 和 Node.js 的支持，用戶下載 VS Code 后，立刻就能夠在書寫 JavaScript 和 TypeScript 時獲得智能提示，而且無需任何配置即可立即調試 Node.js代碼。VS Code 核心團隊有 Node.js 高手，TypeScript 也是微軟官方出品的，VS Code 能把對這兩個語言的支持做好，似乎并不是什么值得驚訝的事情。但是 VS Code 團隊不可能精通所有語言，對于他們不熟悉的語言，VS Code 該怎么支持呢？

最好的辦法莫過于把專業(yè)的事情交給專業(yè)的人來做。為此，VS Code 為編程語言工作者提供了統(tǒng)一的 API ，即Language Server Protocol 和 Code Debugging Protocol，每種語言都能夠通過實現(xiàn)兩個 API 在 VS Code 上得到類似 IDE 的開發(fā)和調試體驗。

而且 VS Code 也并沒有因為 TypeScript 是微軟嫡出就給開小灶，而是對大家都一視同仁，TypeScript 能夠得到的支持，其他語言一個也不落下。比如 Rust 的語言支持，就是由 Rust 官方團隊開發(fā)和維護的，他們可以說是這個世界上最懂怎么給 Rust 做語法支持的一群人了。

在這樣的平臺上，編輯器開發(fā)者、編程語言工作者和社區(qū)，各自做自己最擅長的事情，把份內事做到極致。同時，從開發(fā)到測試，再到用戶反饋都是公開透明的，每個人都能參與其中，把產品往自己希望的方向推進。VS Code 的技術實踐和成果，最后也以開源的形式回饋給社區(qū)，讓大家都能夠借助 VS Code 去打造自己的產品，一起成功。

VSCode 學習路線

簡短地了解了 VS Code 的歷史后，如果你也認同它的設計哲學和使命，你肯定還想知道該如何把 VS Code 的這一套轉化為自己的內力。你可以按照以下三個步驟來逐步掌握 VS Code。

1. 核心編輯器的使用。VS Code 有一套自己的快捷鍵，你可以通過快捷鍵的學習了解核心編輯器所支持的功能。同時， VS Code 允許自定義快捷鍵的映射，如果你有自己熟悉的一套快捷鍵操作，也可以無縫地在 VS Code 上使用。除了快捷鍵，VS Code 對鼠標操作、多光標、搜索都有完備的支持；在編程語言的支持上面，VS Code 也向 IDE 看齊，自動補全、代碼片段等一應俱全。掌握了核心編輯器，VS Code 就能夠勝任你的日常通用編輯器。
2. 工作臺、工作區(qū)的使用。VS Code 中除了編輯器區(qū)域，還有很多其他的功能，像是資源管理器、跨文件搜索、插件管理等，它們一起組成了統(tǒng)一的界面，我們稱之為工作臺。這個工作臺的設計，代表了 VS Code 對工作流的選擇。內置的軟件版本管理，終端模擬器，調試器等，掌握這些 VS Code “欽定”的工具，進一步提升工作效率。
3. VS Code 定制和插件開發(fā)。作為一個百萬級別用戶量的工具，很多功能的默認設置不可能滿足每個人或者每個工作場景，你可以學習如何定制 VS Code 的各個部件，不能永遠按部就班；對于 VS Code 沒有實現(xiàn)的功能，還可以學習一下如何使用 JavaScript 書寫插件，把自己的想法，變成工具的一部分。

通過這三個步驟，你在使用 VS Code 時就能夠“隨心所欲”了。除此之外，我也建議你關注 VS Code 每月的發(fā)布更新日志，官方團隊會詳細講解每個版本新增的功能。VS Code 的官方博客也非常值得訂閱，團隊成員會經常分享開發(fā)過程的心得感悟，算得上是最前沿的技術分享。