作為新時代閃閃發光的各位軟體開發工程師們，在技術變得牛逼了之後，是不是應該提高一下對編輯器的顏值的追求了呢？現在我們就來打造一款顏值逆天的VS Code。
（先睹為快）
我在考慮用什麼詞來形容我想跟大家分享的代碼編輯器VS Code時，就偏偏認為「顏值逆天」恰到好處。「顏值逆天」並非是我裝逼的認為我配置VS Code的美絕天下，只是因為
好多程式設計師的編輯器/IDE都好醜。
我想跟我有共同認知的人不在少數，一些程式設計師對美的滿足真是低到塵埃裡。有的人兩年前下載了一個Sublime text，覺得挺好用，裝了一些滿足功能的插件，一點不裝扮的就能到兩年後。畢竟比windows的記事本好看100倍嘛。可是，作為新時代閃閃發光的各位軟體開發工程師們，在技術變得牛逼了之後，是不是應該提高一下對編輯器的顏值的追求了呢？
如果，你正在使用Sublime， Atom，VS code寫代碼，如果，你也想要讓自己的編輯器改頭換面，變得美觀大方高大上，不妨先給我點個zan，然後耐心讀下去。另外，你還需要一點點實際行動。
我的目的，並非要讓你配製出跟我一模一樣的編輯器，而是打磨出你心儀的編輯器。
一、挑選一款心儀的字體
一定要挑選等寬字體。
一定要挑選等寬字體。
一定要挑選等寬字體。
沒有一款字體能夠讓所有人都喜歡。但是，總有一款字體能夠讓你滿意。在等寬字體中，我推薦五款我覺得十分養眼的給大家，希望你們也喜歡。
1、Source Code Pro
這款來自Adobe的開源字體，是我的最愛。
Source Code Pro
2、Menlo
Menlo
3、Consolas
Consolas
4、Monaco
Monaco
5、Courier New
Courier New
二、 設置合適的字體大小和行高
從來沒有設置過自己編輯器行高的同學，請給我點個zan。[捂臉]
對於字體的選擇，還是有許多人比較在意的。可是，對於行高和字體大小，還真的沒有多少人會理會它們。意識到字體大小和行高對代碼整體美觀的影響極大的人並不多。合適的設置，往往能提高極大的提高代碼的整體逼格。
下面分別是默認行高與調整過後的行高。你們對比一下吧。
不會配置行高的反面教材，參考segmentfault的文章代碼塊。如果能把行高稍微再調大一點，瞬間逼格就不一樣了。
默認行高
調整過後的行高
行高調整過後，更加舒適大氣。行高的選擇，需要根據字體大小來調整，並沒有固定的值。這裡給大家看一下我自己的配置。僅供參考。
首選項 -> 用戶設置 或者直接使用快捷方式 cmd + ,就會自動彈出配置文件settings.json。
我的配置
如果我的配置你不夠滿意，那麼你需要一點點用心，調出你自己喜歡的樣式。
三、挑選一個滿意的代碼高亮主題
首選項 -> 顏色主題 ，會自動彈出如圖所示的顏色主題列表彈窗。VS Code為用戶默認了很多主題，大家可以一一嘗試。
除了默認主題之外，我推薦三款我認為逼格滿滿的高亮主題，希望大家喜歡。
1、Seti
Seti-UI主題是一款極具傳奇色彩的主題。最開始出現在Sublime text中，一出來就徵服了大多數程式設計師。隨後Atom與VS Code都有了相應的插件。和其他大多數配色怪異的主題相比，逼格高了何止一個檔次？
Seti
2、Light +
唯一喜歡的一款默認主題。也是唯一喜歡的一款白色背景主題。如果你的黑色背景的主題感到了厭煩，不妨試試這款另一種風情的配色。
Light +
3、one Dark
因為Atom的推出而備受好評的一款配色主題，其口碑不比Seti-UI差。這款主題讓許許多多顏控程式設計師寧願忍受Atom的卡頓，也要使用Atom，可見大家對它的認可程度之高。
早期Atom就靠顏值吸了一大波分，都是它的功能，現在Atom的性能也得到了極大的提高，仍然是一款值得使用的優秀編輯器。
one Dark
如果你對默認主題，以及我推薦的主題，都表示不滿意的話，你還可以在如下圖所示的地方查找，或者在擴展程序搜索中輸入關鍵字category:themes就能搜索到一大堆主題，相信總會有你滿意的。
主題搜索
三、挑選一個可愛的文件圖標主題
首選項 -> 文件圖標主題，會自動彈出如圖所示的文件圖標主題列表彈窗。這裡同樣也有幾款默認圖標主題，沒準就有你喜歡的。
選擇文件圖標主題
這裡給大家推薦兩款逼格滿滿的主題。
1、Seti
依然偏愛Seti，靈動的小圖標真的太可愛了！
Seti-UI
2、VSCode Icons
VSCode Icons
同樣的，你也可以在應用商店中查找更多的圖標主題。點擊下圖中的按鈕或者在擴展程序搜索框中輸入tag:icon-theme即可搜索。
搜索圖標主題
這裡不得不zan一下vs code的擴展程序管理，做得是真的好。如果被VS code的高顏值吸引，想要嘗試一下它，那麼恭喜你，VS code 的其他特性將會更加讓你無法自拔。
四、高度可定製的VS code
vim因為其高度可定製的特性，曾一度傲視群雄，天下無人能出其右。由於其上手難度奇高，所以vim的使用者也是逼格滿滿，如早起的太陽一般各種傲嬌。在任何場合都可以對其他編輯器的吹噓者不屑一顧。但是隨著隨後陸續出現的 Sublime，Atom，VS code，對vim造成了巨大的打擊。上手難度高成為了vim的致命缺陷。
VS code將高度可定製做得最完美。
1、找到你熟悉的快捷方式
首選項 -> 鍵盤映射擴展 或者在擴展搜索框中輸入@recommended:keymaps搜索，就會出現如下圖所示的列表。
鍵盤映射擴展
下載對應編輯器的插件，你就能把你以前熟悉的快捷鍵平滑的移植到vs code上來。有沒有感覺很厲害。
從圖中下載數量可以看出，大量的vim與Sublime使用者，投入了vs code的懷抱。vs code給這兩款編輯器直接造成了成噸的傷害。
2、不喜歡的都改成自己喜歡的樣子
總有一些小缺點，是無論它再優秀，也是我不願意忍受的。所以我受不了vim的高門檻，忍不了Sublime插件搜索安裝的不便利，所以我沒用使用他們，儘管他們都足夠優秀。
但是vs code 的高度可定製真的做得很為用戶考慮。你喜歡的樣子它都有，不喜歡的樣子都是可以被修改。
cmd + ,彈出設置界面，我們可以發現，這裡面有大量可配置的屬性。
設置界面
每一條配置，都有中文的詳細說明，簡直貼心到爆炸。
配置界面
配置界面
只需要你花一點點時間，你就能找到那些是你想要，那些不是你想要的，然後配置成你想要的樣子。
時間關係，這次VS code暫時就介紹到這裡，下一篇文章將會繼續介紹VS code那些牛逼到無敵的特性，絕對能給你更多的驚喜，敬請期待吧。
作者： 波同學
原文連結：http://www.jianshu.com/p/80e983201f86
出處：簡書