Visual Studio Code 小白使用介紹
前言
現在使用Vscode編碼的人越來越多,憑藉著免費,開源,輕量,跨平臺的特點收貨了一大批忠實粉絲
最近因專案需要開始使用Vscode,但不知為何,感覺有點力不從心,不知道該怎麼用
首先想到去官網看看,然後放棄了(英語渣渣表示壓力山大,其實正因為英語差,才更應該鍛鍊一下的,大家不要學我23333)
最後自己摸索和看相關視訊才豁然開朗。現在做一個歸納總結,希望能幫到有需要的人
下載
官網下載:https://code.visualstudio.com/
漢化中文(官方下載預設為英文,英文好的小夥伴可直接跳過這步)
點選外掛按鈕搜尋 Chinese, 在彈出的選項中選擇第一個中文簡體
img
然後右邊會彈出如下圖安裝介面,接著點選 Install 安裝
img
安裝完畢後會有如下提示(主要提醒你安裝完中文簡體漢化包後一定要重啟方可生效)
img
Vscode介面介紹(主要分為5個區域,分別是活動欄,側邊欄,編輯欄,皮膚欄,狀態列)
img
①:活動欄從上到下依次為,開啟側邊欄,搜尋,使用git,debug,使用外掛
②:側邊欄,新建專案檔案和資料夾
③:編輯欄,編寫程式碼的區域
④:皮膚欄,從左到右依次為,問題,輸出,除錯欄,終端(terminal),最重要的是terminal,用來輸入相關命令
img
⑤:狀態列,點選 [圖片上傳失敗...(image-bcdf98-1559059441856)].png)[圖片上傳失敗...(image-a50ab7-1559059441856)] 該區域可以調出皮膚欄
⑥:需要注意的為下圖紅框所示,分別表示滑鼠游標所在位置和tab縮排字元,這裡為縮排4個字元
img
新建檔案和資料夾
新建檔案:Ctrl+N新建檔案並修改字尾即可(字尾根據所需檔案來,比如.html,.css,.js等)
新建資料夾
①:首先根據需要指定一個路徑(這裡路徑以桌面為例),然後新建一個資料夾(這裡新建的資料夾為demo1)
②:滑鼠點選側邊欄第二個選項,如下圖
img
③:此時會提示你沒有可以開啟的資料夾,點選Open Folder按鈕匯入桌面新建的資料夾demo1
img
④:把資料夾匯入後發現剛剛新建資料夾名字是小寫的,現在變大寫了,這個不影響,不用太在意
img
(右邊圖示從左到右為,新建檔案 / 新建資料夾 / 重新整理 / 摺疊檔案)
注:新建檔案一定要修改字尾,否則預設都是text文字檔案
自動儲存設定
File(檔案)- Preferences(首選項)- Setting (設定)然後彈出下面介面,選擇User(一般會預設選中該選項),
接著如下圖選擇afterdelay選項即可,下面有個數字1000表示1秒,這個可自行設定,表示多少秒以後自動儲存
img
自動格式化程式碼
File(檔案)- Preferences(首選項)- Setting (設定)
User(使用者)- Text-Editor(文字編輯)- Formatng(格式化)
然後勾選下圖紅色框中的選項後重啟Vscode即可
img
Vscode更換主題
File(檔案)- Preferences(首選項)- Color-Theme (顏色主題)
img
然後會出現下圖紅色框的介面,此時按鍵盤上的上下鍵即可實時檢視主題顏色,直接回車可選中對應主題
img
注:可以點選外掛直接搜尋 theme 下載其它非內建主題
快捷鍵(只列出了很小一部分常用快捷鍵)
Ctrl + / (單行註釋)
Shift + Alt + A (多行註釋)
若要取消單行或多行註釋在按一次該快捷鍵即可
Ctrl + Shift + Enter (上方插入一行,滑鼠游標在當前行的任意位置都可以直接換行到上一行)
Ctrl + Enter (下方插入一行,滑鼠游標在當前行的任意位置都可以直接換行到下一行)
Alt + Shift + F (格式化程式碼,不需要全選中程式碼,直接格式化即可)
Ctrl + Shift + F (查詢檔案)
點選設定選擇 keyboard shortcuts,右邊會彈出所有快捷鍵目錄
我沒有漢化中文,並不是因為英語好,相反因為英語太差,所以還是想邁出第一步,鍛鍊一下吧
大家不要怕,擼起袖子就是幹ヾ(◍°∇°◍)ノ゙
img
作者:菜鳥飛不動
連結:https://www.jianshu.com/p/95c4c869bff1
來源:簡書
著作權歸作者所有。商業轉載請聯絡作者獲得授權,非商業轉載請註明出處。
相關文章
- Visual Studio Code 使用指南
- Visual Studio Code 使用筆記筆記
- Visual Studio Code
- 【Python】—{Visual Studio Code}Python
- Microsoft Visual Studio CodeROS
- Visual Studio Code 1.78 釋出!
- Visual Studio Code 和 GitHub CopilotGithub
- Visual Studio Code 1.77 釋出!
- Java on Visual Studio Code的更新Java
- 使用Visual Studio Code進行MicroPython程式設計Python程式設計
- 在 Visual Studio Code (VS Code) 中設定
- 20200115 - Visual Studio Code 編輯器
- Visual Studio Code 常用外掛分享
- Java on Visual Studio Code 3月更新Java
- 12月更新 | Visual Studio Code PythonPython
- 正式釋出 | Visual Studio Code 1.65
- Java on Visual Studio Code 2月更新Java
- 10月更新 | Java on Visual Studio CodeJava
- 10 月更新 | Visual Studio Code PythonPython
- 3月更新 | Visual Studio Code PythonPython
- 6月更新 | Visual Studio Code PythonPython
- 6月更新 | Java on Visual Studio CodeJava
- Java on Visual Studio Code 4月更新Java
- Anaconda 使用和 Visual Studio Code,PyCharm 對接全解析PyCharm
- 如何使用 Visual Studio Code 除錯 Angular Schematics 實現除錯Angular
- 介紹一個能將任意關鍵字高亮實現的 Visual Studio Code 擴充套件套件
- 介紹一個功能強大的 Visual Studio Code 擴充套件 - Rest Client,能部分替代 Postman套件RESTclientPostman
- Visual Studio Code 內建終端配色
- Visual Studio Code 10個最佳主題
- 正式釋出丨Visual Studio Code 1.68
- 5月更新丨Java on Visual Studio CodeJava
- 使用Visual Studio Code編寫和啟用ABAP程式碼 (上)
- Visual Studio Code常用設定及快捷鍵
- "Visual Studio Code is unable to watch for file changes in this large workspace"
- 美膩!Visual Studio Code 介面毛玻璃效果!
- Pay close attention to your download code——Visual Studio trick to run code when buildingUI
- 如何讓 Visual Studio Code 裡顯示 Cypress 的 intelligent code suggestionIntel
- 在 Visual Studio Code 中配置 Python Flask 環境PythonFlask