visual studio code怎麼使用

演示機型：華為MateBook X

系統版本：win10

APP版本：visual studio codev1.61.0

visual studio code怎麼使用共有4步。以下是華為MateBook X中使用visual studio code的具體操作步驟： 操作/步驟

1、點選Explorer

開啟visual studio code軟體，第一個常用功能是Explorer，即瀏覽器功能。

2、點選File選單

第二個常用功能是File選單，即檔案選單。

3、點選Debug選單

第三個常用功能是Debug選單，即除錯功能。

4、點選Terminal

第四個常用的功能是Terminal選單，即命令列功能。 END 總結：以上就是關於visual studio code怎麼使用的具體操作步驟，希望對大家有幫助。

小編還為您整理了以下內容，可能對您也有幫助：

visual studio code怎麼用

Microsoft 今天在其 Build 開發者大會上正式宣佈了 Visual Studio Code 專案：一個運行於 OS X，Windows 和 Linux 之上的，針對於編寫現代 web 和雲應用的跨平臺編輯器。該應用仍然處於預覽版階段，但是你現在就可以在這裡下載體驗。

這標誌著 Microsoft 第一次向開發者們提供了一款真正的跨平臺編輯器。雖然完整版的 Visual Studio 仍然是隻能執行在 Windows 之上，但是今天的宣告向我們展示了這家公司對於支援其他計算機平臺的承諾。

逗很多人都使用 Windows 作為他們的開發環境，但是我們也注意到了，還有很多人使用 Linux 和 Mac逗，Somasegar，Microsoft 公司的開發者事業部總裁在這周稍早時候對筆者如是說道。地我們想讓他們能夠在他們習慣的平臺上使用我們公司的產品，而不是非要遷徙到 Windows 上逗。這些平臺上的很多開發者們也更樂意於使用像 Sublime Text 這種輕量級的程式碼編輯器，而非像 Visual Studio 這種全特性的 IDE。

Visual Studio Code 為開發者們提供了對多種程式語言的內建支援，並且正如 Microsoft 在今天 Build 大會的 keynote 中所指出的，這款編輯器也會為這些語言都提供了豐富的程式碼補全和導航功能。JavaScript，TypeScript，Node.js 和 ASP.NET 5 開發者也將會獲得額外的工具集。

該編輯器也集成了所有一款現代編輯器所應該具備的特性，包括語法高亮（syntax hight lighting），可定製的熱鍵繫結（customizable keyboard bindings），括號匹配（bracket matching）以及程式碼片段收集（snippets）。Somasegar 也告訴筆者這款編輯器也擁有對 Git 的開箱即用的支援。

正如 Somasegar 所言，新款編輯器部分基於 Microsoft 為 Visual Studio Online 編寫 Monaco 編輯器時的經驗，但是該公司也正努力將一些 Visual Studio 的語言特性帶到 Visual Studio Code 上，例如 Roslyn 專案，Microsoft 的 .NET 編譯器平臺。並且 Microsoft 聲稱這些為 VSC 打造的語言服務也會在其他編輯器包括 Sublime Text，Vi 以及 Atom 中可用。

上面提到的一些語言特性已經在其他編輯器中可用了。就在不久前，Microsoft 啟動了針對 Sublime Text 的 TypeScript 外掛專案，並且 Somasegar 告訴筆者該公司承諾會在未來啟動更多類似於這樣的專案（歸根結底，是為了滿足開發者們的需要）。

Visual Studio Code 的釋出的確來的很突然。然後仔細想想這在一段時間之前就已經有了預兆，比如 .NET 核心的開源（以及使其能夠跨平臺執行）或者是社群版的 Visual Studio Community 的啟動。

如果是在短短几年前，今天的宣佈勢必會引起軒然大波，但是今天，這對我們來說更多的是驚喜。

Mac 終端 Terminal 中使用 Visual Studio Code

一、如果是預設bash

command+shift+p 輸入shell 第一項

之後就可以使用code快捷命令了

code . // 使用 vscode 開啟當前目錄

code filename // 使用 vscode 開啟檔案

二、如果shell使用的是zsh

echo"alias vscode='/Applications/Visual\ Studio\ Code.app/Contents/MacOS/Electron'">> ~/.zshrc

visual studio code怎麼執行

你可以下載VS然後使用VS中的cl編譯器，百度一下“在控制檯使用cl編譯器”，大概就是這個意思。主要是環境變數，include的包含資料夾這些設定。

完成這些，win+R，cmd 輸入cl測試一下。VSC自帶在編寫程式碼的時候，右鍵開啟當前檔案目錄的控制檯。

比如C++，在VSC中寫完程式碼後，儲存為 name. cc，然後開啟控制檯（進入當前目錄），輸入 cl name. cc 編譯，成功以後，輸入 name 就可以運行了。

用編輯器（比如VSC）配合編譯器（比如cl）寫小程式比IDE（比如VS）效率高得多，畢竟IDE太大太慢了

目前VSC不支援中文編碼

visual studio code 怎麼執行程式碼的

除錯方式一般有兩種：

第一種：可以直接編輯你要輸入的程式碼，然後點選“檔案”進行“儲存”。在你所儲存的地方可以看到下圖，這個儲存的是一個純文字，直接開啟（如用瀏覽器）可以看到自己所編譯的程式碼語句。從上圖的右下角可以看到純文字三個字。然後對此資料夾修改副檔名，例如html和js，一般生成html，則副檔名為html，就可以看到此檔案自動變成了網頁檔案，用瀏覽器開啟可以看到不再是之前的程式碼，而是執行的結果。在VS Code 中修改語句進行儲存，再重新整理網頁則出來新的結果。

第二種：點選右下角的純文字，頂部則會出現語言讓你選擇，選擇之後進行編譯你的程式碼，然後儲存。再用瀏覽器開啟你所儲存的檔案，則出現執行結果。修改程式碼，儲存後對網頁進行重新整理，則出現修改後的結果。

visual studio code怎麼設定

1.1 認識檢視介面

和大多編輯器一樣，該有的基本都有。

1.2 資料夾和檔案的開啟

檔案——>開啟資料夾/開啟檔案

1.3 新建檔案/資料夾

新建檔案：

a. 檔案——>新建檔案；

b. 按Ctrl+n;

c. 點資料夾名後面的+號圖示。

新建資料夾：

點資料夾名後面的+號圖示。

1.4 拆分編輯器（分列）

快加鍵：Ctrl+\

點選拆分編輯器圖示（右上角）進行拆分編輯器。拆分完畢之後，可以通過滑鼠點選拖動檔案到相應的列。多列同時瀏覽免去多檔案來回切換。

1.5 整合終端

終端對開發者來說不可或缺，Visual Studio code 自然也自帶終端視窗。

可按快捷鍵Ctrl+`快速調出終端，也可以 檢視——>整合終端 調出。

需要注意的是：如果當前的資料夾的路徑名稱包含中文，會出現終端開啟失敗（待驗證）。

1.6 安裝/解除安裝擴充套件（外掛）

a. 進入擴充套件檢視介面安裝/解除安裝

a1.快捷鍵：Ctrl+shift+x；

a2.檢視——>擴充套件；

a3.點左側邊框的擴充套件圖示按鈕進入。

在頂部搜尋框輸入你需要的擴充套件外掛，找到之後在擴充套件外掛後面的選項中點選【安裝】即可，需要解除安裝擴充套件只需要點【解除安裝】即可。

擴充套件下載安裝完畢之後需要點選【啟用】才生效，有些擴充套件需要重啟編輯器才生效。

b. 如何選擇擴充套件（外掛）呢？

其實也不難，擴充套件的名稱一般都暴露了它的功能，基本如下：

1.帶snippets 一般是程式碼提示類擴充套件；

2.帶viewer 一般是程式碼執行預覽類擴充套件；

3.帶support 一般是程式碼語言支援；

4.帶document 一般是參考文件類擴充套件；

5.帶Formatt 一般是程式碼格式化整理擴充套件；

當然有的snippets 也自帶support功能，並不是以上面的關鍵詞作為唯一標準。

1.7 檔案圖示主題設定

之前寫的有一篇經驗，連結附上。

0Visual Studio Code 怎麼設定檔案圖示主題？

END

2.VS code使用者設定

2.1 使用者設定入口

VS code支援使用者自定義設定編輯器，包括快加鍵修改、程式碼高亮、以及擴充套件外掛配置等，點選檔案——>首選項——>使用者設定。

編輯器會拆分為兩列，一個檔案是【預設設定】，一個是【settings.json】，使用者設定是空的【settings.json】這個檔案（之前沒有設定的話），需要自定義的設定項就在settings.json檔案裡寫入json程式碼即可。

2.2 自定義的設定方法為：

1、在【預設設定】裡找到相關的設定json程式碼段，複製該設定完整的json塊，例如：【"editor.fontSize": 14,】。

2、到【settings.json】貼上。不過記得加上外層（前後）“{}”符號，不然不是完整的json，會出錯或者設定無效。

例如：

{ "editor.fontSize": 20}

完後按Ctrl+s儲存關掉視窗，編輯器的文字的大小就變成20了。

需要注意的是，【settings.json】的程式碼必須符合json格式，且名稱（如上面的editor.fontSize）和值對（如上面的20）是【預設設定】裡有的或者是擴充套件中支援的，不然不會有任何作用。

END

3.外掛推薦及使用配置

VS code的擴充套件還是比較豐富的，具體選擇方法在前面的步驟1.6已經教大家了，下面介紹幾個對基本web前端編輯比較實用的擴充套件外掛（我個人認為）。

3.1 HTNL Snippets

為HTML文件提供程式碼提示功能，包含HTML5。

3.2 easyless為less文件提供提示，錯誤警告，以及把less文件編譯為css檔案。可自定義設定。開發者給出的配置例子：

"less.compile": {"compress": true,"sourceMap": true,"out":false}

可以貼上到使用者設定的【預設設定】裡，也可以貼上到使用者設定settings.json裡。後面的懂json的同學自動忽略：如果settings.json是空的，應該寫成：

{"less.compile": {"compress": true,"sourceMap": true,"out":false}}

如果之前已有寫入json程式碼，你應該在前面的名稱/值對塊後面加上“,”（新手容易多加或者少加","符號，個人覺得是這樣的）。

****提示：****

在寫的時候，程式碼內最好不要加註釋。"sourceMap": true, 這個地方最好設定成false ，因為當你實際使用的時候瀏覽器找不到sourceMap 可能會報錯或者瀏覽器一直去找，還沒遇到過（我碰到jQuery.js因為這個報錯的），入門的同學還是設定成false 比較好。

3.3 VS color Picker

為css文件和HTML文件提供顏色選擇，當輸入“#”後會出現顏色選擇器浮窗，點選相應顏色之後會插入文件中，預設用16進製表示。若想用其他格式的顏色，如RGB等則推薦擴充套件：Color Picker (Color Picker缺點是需要配置，安裝nodejs，並且新增node到全域性環境變數中。而且在插入時需要使用命令調出提色板，有點麻煩）

3.4 live HTML Previewer

為html文件提供預覽功能，需要用命令或者快捷鍵調出，會在編輯器中新增一列，用於執行html檔案。

a. 按F1在命令框中輸入：Show side preview 新增一列顯示html，能邊寫邊看到效果，實時預覽。

b. 可以在html文件中右鍵選擇：Open in browser 在系統預設瀏覽器中開啟，該模式下不能提供實時預覽,儲存時不自動重新整理瀏覽器。

3.5 SVG Viewer

為SVG 文件在編輯器中提供預覽。

a. 按F1在命令框中輸入：SVG

b. 選擇SVG Viewer,新增一列顯示SVG執行結果。

END

4.VS code 使用者程式碼片段

4.1 使用者程式碼片段 設定入口及示例

使用者程式碼片段 是用來提示程式碼提示及快捷插入的，那麼怎麼做呢？

1.檔案——>首選項——>使用者程式碼片段

2.選擇程式碼語言

3.按固定格式寫json程式碼

示例格式：

"Print to console":

{"prefix": "log",

"body": ["console.log('$1');","$2"],"description": "Log output to console"}

4.2 片段json示例寫法詳解

可變區域（這裡用XXXX表示）如下：A. "Print to XXXX": {

//僅作為標識和目的用途，區別於其他程式碼塊（有多個相同值時會報錯），不會插入。

B."prefix": "XXXX",

//觸發提示的關鍵字元，也就是輸入什麼時彈出提示窗。例如:當希望輸入a的時候就彈出，這裡就寫a。在提示窗顯示。

C. "body": ["XXXX $1 XXXX"],

//在編輯器中插入的程式碼塊，例如當在提示窗中選擇a的時候就插入【<a>a</a>】那麼這裡就寫：<a>a</a>

D. "description": "XXXX"

// 這裡是相關描述，比如說明插入的程式碼塊內容、用途、程式碼結構、引數等，僅在提示窗顯示不會插入}

E. 上面示例中的$1和$2是初始定位游標位置，用於插入後需要修改的值、引數等。還是上面的例子：

"body":["<a>$1</a>"]

那麼在插入<a></a>之後，游標的位置將處於<a>和</a>的中間。再如：

"body":["<a>$1</a>",

"<span>$2GBK</span>"]

那麼在插入

<a></a>

<span>GBK</span>

之後，游標首先在a標籤內，輸入完內容之後，游標跳到<span>和GBK中間。輸入或者移動游標之後游標恢復正常

4.3 怎麼使插入的程式碼塊符合格式化標準？

程式碼格式化主要就是縮排和換行了。

1.要縮排的地方按下TAB鍵即可，例如：[" <a>$1</a>"]

2.怎麼在"body":[]中插入帶雙引號的內容?因為註釋帶有特殊符號尤其是帶有雙引號（"")的內容會導致json報錯，解決方法是用反斜槓“\”對特殊符號進行轉義。

例如：

那麼"body":[]那裡應該這樣寫:

這裡在"description": "XXXX"那裡同樣適用。

總的來說，碰到json報錯的字元或者符號就用反斜槓“\”進行轉義。當然你要考慮插入之後會不會影響程式文件報錯或者出現異常，也就是要先確定插入的程式碼塊是正確的完整的，這是自定義程式碼塊存在的意義

4.4 下面是我寫的一段完整的示例(XXXX都匿了)：自定義的json{

"Print to authorInfo": {

"prefix": "au",

"body": [

"-----By Ray-----",

"mail:XXXXXXX",

"description:$1",

" Step 1:",

" Step 2:",

"<a href=\"XXXX/\">凱玩網</a>"],

"description": "author info"

軟體技巧（8）---- Ubuntu 開發環境搭建/Visual studio code 使用技巧

Ubuntu 18.04安裝完後，還需要做一些配置才能愉快的使用，包括更新軟體源、安裝搜狗輸入法、安裝eclipse、Chrome瀏覽器、配置快捷鍵、安裝git、安裝Visual studio code 等等，下面就來介紹這些軟體的配置方法.

sudo apt-get update 等待源更新完成即可

直接在Ubuntu 的軟體中心找到 Chromium 輸入法安裝即可

直接在Ubuntu 的軟體中心找到Visual Studio Code安裝即可

直接在Ubuntu 的軟體中心找到Eclipse安裝即可

回到“語言支援”視窗，在鍵盤輸入法系統中，選擇“fcitx”

如果在鍵盤輸入法系統中，沒有“fcitx”選項時，建議先開啟終端手動安裝fcitx：sudo apt-get install fcitx 等安裝成功之後再執行上述步驟點選“應用到整個系統”，關閉視窗，重啟電腦

重啟後使用 shift 鍵就可以切換輸入法

設定 -- Device -- Keyboard 選項

配置 shift + windows + S 鍵為我們截圖的快捷鍵

檔案-- 開啟資料夾 就可以開啟一個工作區

檔案 -- 首選項 -- 設定 在設定裡更改字型，注意的字型是需要自己手動輸入的

在需要查詢的變數或者函式上右擊 -- 查詢定義

工作區分為檔案預覽區，函式預覽區（大綱)，編輯區

編輯器右側 -- 顯示開啟的編輯器，可以查詢檔名或者函式名

格式為 / .a 表示排除所有資料夾下的 .a 檔案

Visual Studio Code 怎麼安裝外掛

1、首先開啟vscode軟體，點選左邊按鈕中的外掛按鈕，進去後這裡有個搜尋框，軟體預設也會推薦一些外掛，可以根據需要安裝。如果是精確的安裝一個外掛，可以點選上方的搜尋按鈕搜素：

2、比如搜素一款能夠同步vscode設定的名叫Settings Sync的外掛，輸入搜尋詞後，下方會展示搜尋結果，點選進入外掛說明，在右邊的介面上點選安裝按鈕：

3、等待數秒安裝完畢後，點選重新載入才能使它生效：

4、重啟vscode後，外掛就安裝成功了，此時很多外掛會在右下角彈出提示框。以上就是Visual Studio Code 安裝外掛的方法：

如何使用 visual studio code 編譯和除錯 java 程式碼

介紹

Visual Studio Code的宣傳語是：

一個運行於 Mac OS X、Windows和 Linux 之上的，針對於編寫現代 Web 和雲應用的跨平臺原始碼編輯器。

按說的，Visual Studio Code特別適合來作為前端開發編輯器。

內建html開發神器emmet(zencoding),對css及其相關編譯型語言Less和Sass都有很好的支援。

當然，最nice的還是寫js程式碼了，這也是接下來要著重介紹的功能。

智慧提示

因為之前微軟推出了typescript語言，結合tsd檔案，用visual studio寫typescript程式碼是相當爽的，智慧提示的功能非常nb。

這個功能理所應當也被vsc繼承了。

目前主流的前端類庫/框架，包括node.js及其模組/框架都有相應的tsd檔案，可以去DefinitelyTyped上找一下。

在專案中引入對應檔案，就可以有智慧提示了。

這裡以angular為例，使用步驟如下：

全域性安裝tsd，通過tsd安裝.d.ts檔案。這樣會在專案下面生成.typings目錄，目錄下面就是下載的.d.ts檔案，再寫程式碼的時候就會有智慧提示了。具體用法參考tsd用法。

npm install -g tsd

tsd query angular --action install

如果不想自己手工引入，也可以在angular變數後面按ctrl+k，會有個燈泡圖片，點選燈泡圖片就會有對應提示，選擇下載xx.d.ts檔案就可以了,編輯器會下載對應檔案放在.typings目錄。

過程如下圖：

說完智慧提示，再說程式碼除錯。

除錯Node

之前寫過文章介紹過node.js的除錯方案（Node.js除錯）。從vsc釋出後，就一直用寫程式碼，也是用來除錯node.js程式碼。

使用方法也很簡單,步驟如下：

開啟要除錯的檔案，按f5,編輯器會生成一個launch.json

修改launch.json相關內容，主要是name和program欄位，改成和專案對應的

點選編輯器左側長得像蜘蛛的那個按鈕

點選左上角DEBUG後面的按鈕，啟動除錯

打斷點，盡情除錯

過程如下圖：

最後，再贈送彩蛋一個。

Node API 檢視

在寫node.js程式碼的時候，有時會忘記某個模組中有哪些方法及其用法，經常要去官網翻一下api文件。

這裡介紹下怎麼使用vsc來搞定這一問題。

開啟vsc控制檯（Help > Toggle Developer Tools > Console）

在控制檯寫程式碼，查詢模組方法。

過程如下圖：

vsc是用atom-shell(現在叫electron)寫的，這和node-webkit（現在叫nw.js）一樣，都是把node.js和chrome結合起來的工具，所以可以這麼使用。

不過vsc使用到的node.js模組並不多，比如引用util和vm等會報錯，用node-webkit就不會這樣。

如何使用 visual studio code 編譯和除錯 java 程式碼

如何使用 visual studio code 編譯和除錯 java 程式碼

演算法可表示如下：

S1: sigh=1

S2: sum=1

S3: deno=2

S4: sigh=(-1)×sigh

S5: term= sigh×(1/deno )

S6: term=sum+term

S7: deno= deno +1

S8:若deno≤100，返回S4；否則，結束。

visual studio code怎麼執行python怎麼

1.安裝 Python 外掛 進入主介面之後按Ctrl + p,輸入:ext install python,下載第一個即可。 下載Python 外掛後即可在編寫 Python 指令碼時使用程式碼自動補全功能。

2.設定 Python 執行 要在Visual Studio Code 中執行 Python 程式碼需要修改 tasks.json 配置程式碼,而修改 tasks.json 配置程式碼則必須先建立工作資料夾。