簡介

這將是一個新的系列，將會以 Visual Studio Code（後文都簡稱為 VSCode 啦）的操作，環境配置，外掛介紹為主，為大家不定期的介紹 VSCode 的一些操作技巧，所以取名 VSCode 小雞湯，本篇將會介紹最基礎的 VSCode 安裝，以及 VSCode 中基本的編輯功能

VSCode 安裝

既然是 VSCode 小雞湯，那麼 VSCode 就是必不可少的了，不然就是白水煮蔥姜了(´▽`) ，在 VSCode 官網 可以找到對應系統的 VSCode 的下載或是安裝

Windows 和 macOS

Windows 使用者和 macOS 使用者安裝起來都比較容易，通過下載官方的安裝程式或是 DMG 檔案即可完成安裝

Linux

Linux 向來都是折騰的代言，所以 Linux 的安裝會比較麻煩，不過對於主流 Linux 發行版 VSCode 官方都提供了對應的軟體源，只要版本不是太偏應該都很容易安裝的，這裡列舉一些發行版的安裝方法

下面大部分內容來自官方文件 Visual Studio Code on Linux

Debian 和 Ubuntu

在 Debian 和 Ubuntu 下最快捷簡單的安裝方式就是直接下載安裝包 .deb package (64-bit) 通過圖形介面或是命令列直接安裝，使用安裝包安裝會自動安裝軟體源，這樣以後也能自動升級，如果不使用包安裝，那麼可以手動新增軟體源來安裝

curl https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > microsoft.gpg
sudo install -o root -g root -m 644 microsoft.gpg /etc/apt/trusted.gpg.d/
sudo sh -c 'echo "deb [arch=amd64] https://packages.microsoft.com/repos/vscode stable main" > /etc/apt/sources.list.d/vscode.list'

之後可以通過 apt-get install code 來完成安裝，或者 apt-get install code-insiders 安裝 insider 版本（更新更快的測試版）

sudo apt-get install apt-transport-https
sudo apt-get update
sudo apt-get install code # or code-insiders

RH 系 —— RHEL，CentOS，Fedora

先安裝軟體倉庫

sudo rpm --import https://packages.microsoft.com/keys/microsoft.asc
sudo sh -c 'echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com/yumrepos/vscode\nenabled=1\ngpgcheck=1\ngpgkey=https://packages.microsoft.com/keys/microsoft.asc" > /etc/yum.repos.d/vscode.repo'

之後如果是 Fedora 22 以後的版本可以直接通過 dnf 來安裝

dnf check-update
sudo dnf install code

如果是其他的（Fedora < 22，CentOS，RHEL）那麼通過 yum 來安裝

yum check-update
sudo yum install code

RH 系也可以直接下載 rpm 包安裝，但是這樣安裝後不會安裝軟體引數，無法自動更新，所以並不推薦這樣安裝

OpenSUSE 系

先安裝軟體倉庫

sudo rpm --import https://packages.microsoft.com/keys/microsoft.asc
sudo sh -c 'echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com/yumrepos/vscode\nenabled=1\ntype=rpm-md\ngpgcheck=1\ngpgkey=https://packages.microsoft.com/keys/microsoft.asc" > /etc/zypp/repos.d/vscode.repo'

使用 zypper 安裝

sudo zypper refresh
sudo zypper install code

ArchLinux

ArchLInux 有一個社群維護的 aur 包，可以直接安裝

開始使用

安裝完成後，大部分系統都會建立一個應用程式的啟動器或者快捷方式，一般來說直接點選就可以開啟了，開啟後可以看到 VSCode 的主介面

接下來介紹下使用 VSCode 時一些必備的知識

Activity Bar

左邊豎著的是 VSCode 的 Activity Bar，上面初始從上到下分別是“Explorer（檔案瀏覽器）”，“Search（搜尋）”，“Source Control（程式碼控制）”，“Debug（除錯）”，“Extensions（外掛）”五個功能，這五個功能也是 VSCode 的基礎功能，在安裝其他外掛後可能會在 Activity Bar 上增加新的按鈕

VSCode 的專案結構組織

沒有開啟任何專案的情況下，開啟 Explorer 介面我們可以看到當前開啟的檔案，下面會提示我們還沒有開啟目錄

VSCode 中，一般來說開啟目錄就相當於是一個專案，我們在開啟目錄後可以在 Explorer 介面進行檔案的增刪改操作，也可以通過快速開啟功能開啟當前開啟目錄下的檔案，查詢功能也會搜尋當前開啟目錄下的所有檔案

如果需要一次開啟多個目錄，那麼可以在 Explorer 空白處右鍵選單中選擇“Add Folder to Workspace”新增新的目錄

這時候 Explorer 會自顯示 Workspace 下的所有專案

這時候同樣快速開啟，搜尋功能，都會支援搜尋所有在 Workspace 中的目錄，同時會顯示檔案是屬於哪個目錄

.vscode 目錄

在開啟專案的情況下，如果在當前專案或者工作空間，有特定的設定，或者有除錯設定，那麼 VSCode 會在專案目錄下面建立一個 .vscode 目錄用於存放 VSCode 對於專案或是工作空間的特定設定

使用 ⌘ - ,（Ctrl - ,）開啟設定介面，其中 Workspace Setting 就是針對當前工作空間的設定

如果開啟的工作空間有多個目錄，那麼還可以針對每個目錄單獨設定

終端

使用 ⌘ - ` （Ctrl - `）可以快速在當前工作路徑開啟終端，使用加按鈕，可以開啟新的終端，使用垃圾桶按鈕可以關閉當前的終端，點選終端選擇下拉器可以選擇當前終端，點選叉只是隱藏底部的區域，並不會關閉

其他常用小技巧

• 最近專案：在啟動頁面，如果之前開啟過專案的話可以使用 Ctrl - r 選擇最近開啟的專案（資料夾或是工作空間）

• 快速開啟：使用 ⌘ - p 可以開啟快速開啟介面，可以通過名稱快速的搜尋當前工作空間下的所有檔案，在快速開啟的搜尋框中輸入 > 可以開啟 Command Palette（命令視窗），輸入 @ 可以搜尋當前檔案的符號，輸入 # 可以按名稱搜尋整個專案的 Tag，這些是常用的，輸入 ? 可以看到所有的功能

• 對於 VIM 使用者：強烈建議使用 Vim 外掛，並且開啟 EasyMotion

• 換個檔案圖示主題：Material Icon Theme 看上去挺不錯，不過偶爾也可以換換其他的

• 換點顏色主題：VSCode 中有很多顏色主題，過段時間換一換，感受下不同的氣氛和心情

結語

這是我給大家帶來的第一碗 VSCode 小雞湯，內容含量可能不是很高，主要以安裝和簡單配置和使用為主，後續會跟上一些使用上的技巧或是環境搭建之類的主題，希望本文能給大家搬磚生活帶來一些幫助，寫的不好的地方大家也別吝嗇該丟磚就丟磚

VSCode 之類的現代文字編輯器，在外掛的搭配下已經可以慢慢的在部分方面接近 IDE 了，我已經全面使用 VSCode 約兩年左右，目前在專案開發上已經慢慢疏遠了曾經最愛的 VIM，畢竟搭配 Vim 外掛後，與 VIM 已經非常接近了，並且有很多開箱即用的工具，個人一直侍奉的原則就是使用合適的稱手的工具，而不為了炫技一定要用什麼

最後歡迎大家訂閱我的微信公眾號 Little Code

• 公眾號主要發一些開發相關的技術文章
• 談談自己對技術的理解，經驗
• 也許會談談人生的感悟
• 本人不是很高產，但是力求保證質量和原創