vscode的使用

  • 2019 年 10 月 7 日
  • 筆記

一、為什麼有此篇文章

之前工作主要語言還是c，所以用的最多的也就是source insight和vim。後面又有了研究golang，對jetbrains的全家桶goland和clion有了使用。慢慢地接觸了更多的語言。看程式碼的工具也慢慢往vscode和jetbrain的工具靠近。

二、vscode的使用

2.1. vscode的安裝

在https://code.visualstudio.com/ 可以下載到最新的vscode安裝包。

注意不要下載錯了，下成vs studio。兩者還是差別挺大的。

2.2. vscode的工程導入

點擊File菜單選項，有open folder和open workspace選項。兩者的區別是，workspace會保存打開工程的一些設置，下次可以直接還原之前的設置。第一次使用open folder打開，保存成workspace，下次就可以使用open workspace打開。

2.3. vscode的左邊欄

左邊欄分別是文件夾目錄、檢索、版本管理、debug工具和擴展工具。最上面還有個vs code圖標，雙擊可以最大化/還原窗口。

圖1、vscode的左邊欄

最底下有個設置按鈕，點開有個彈窗。依次是命令行快捷欄（可以呼喚出快捷命令），設置，擴展插件，鍵盤快捷鍵，程式碼小抄（可以存儲/調出常用的程式碼片段），介面配色和圖標方案。

圖2 設置的小彈窗

2.2. vscode的顏色

2.2.1 程式碼編輯器的顏色

綠色表示整行是新增的 ，藍色是行修改的。紅色小游標是刪除的行

圖3 程式碼編輯器的顏色

2.2.2 文件夾的顏色

圖4 刪除的文件
圖4 修改的顏色

這些顏色方案都可以通過setting->搜索colorCustomizations，點擊Edit in settings.json。在json文件編輯各種情況的顏色。

 "workbench.colorCustomizations": {      "gitDecoration.addedResourceForeground": "#f45342",      "gitDecoration.modifiedResourceForeground": "#3888d8"    }, gitDecoration.addedResourceForeground:...
圖5 編輯顏色方案

2.3 插件安裝

插件可以打開左側的插件欄安裝插件，可以安裝推薦的或者流行度高的插件，或者在編輯程式碼的過程中，vs code也會主動建議你安裝某些插件。

插件分類可以有：

  • 自動補齊插件：Auto Close Tag，Code Speel Checker, Path Autocomplete, Path Intellisense
  • 漢化插件： Chinese Language Pack
  • 語言支援：Cmake，Go, HTML Snippets
  • 前端插件：Debugger for Chrome, EsLint
  • 版本控制: GitLens, Git History
  • 包管理工具: npm
  • 配色插件: One Dark Pro
  • 交互模擬插件：Sublime Test Keymap, Vim

Tags:

VirMach 便宜 VPS