這裡介紹在 Mac OS X 中如何安裝與使用免費的微軟 Visual Studio Code 來開發各種類型的程式。

微軟提供的 Visual Studio Code 是一個免費的輕量級軟體開發工具,同時支援 Windows、Mac OS X 與 Linux 系統,對於有跨平台開發需求的開發者,Visual Studio Code 是一個非常方便的程式碼編輯工具。

安裝 Visual Studio Code

以下是 Visual Studio Code 在 Mac OS X 中的安裝與基本使用方式。

Step 1

從微軟 Visual Studio Code 的官方網站下載 Visual Studio Code 的 Mac OS X 版安裝檔。

Step 2

Mac OS X 版本的 Visual Studio Code 下載下來的檔案是一個 zip 壓縮檔,解壓縮之後就是 Visual Studio Code 應用程式,將這個應用程式用滑鼠拖曳進「應用程式」目錄中就完成安裝了。

Mac OS X 安裝 Visual Studio Code

Step 3

安裝好 Visual Studio Code 之後,就可以使用它來開發各種程式語言的專案了,它支援的程式語言種類很多,例如 Batch、Clojure、Coffee Script、Dockerfile、F#、Go、Jade、Java、Makefile、Objective-C、Perl、PowerShell、Python、R、Razor、Ruby、Rust、SQL、Visual Basic 與 XML 等,

Visual Studio Code

可以分割程式碼編輯視窗,同時比較多的檔案內容。

VS Code 分割程式碼編輯視窗

還有自動完成(autocomplete)的功能。

自動完成(autocomplete)

Visual Studio Code 原生就支援 R 程式碼的編輯,連自動完成的功能也可以使用,這一點是一般編輯器比較少見的。

R 程式碼

使用 Visual Studio Code 除錯

Visual Studio Studio 原生就支援 Node.js 程式的執行與除錯(debug),對於 JavaScript 的開發者來說相當方便。

執行 Node.js 程式

這是對 JavaScript 程式設定中斷點,並監看各個變數值的狀況。

Node.js 程式設定中斷點除錯

至於其他程式語言可以從 Visual Studio Code Marketplace 網站下載並安裝對應的除錯擴充功能來使用,請繼續閱讀下一頁。

Marketplace

Visual Studio Code Marketplace 網站上有非常多的外掛程式可以下載使用,如果您想要的功能在 VS Code 中沒有內建,就可以從這裡找找看。

這裡我們示範如何安裝 Python 的除錯擴充功能,讓 VS Code 可以對 Python 的程式進行逐步的除錯。

Step 1

Visual Studio Code Marketplace 網站 搜尋 Python 的除錯擴充功能。

Visual Studio Code Marketplace

Step 2

進入 Python 的除錯擴充功能的 Marketplace 頁面,將安裝(Installation)的指令複製起來。

Python 除錯擴充功能

Step 3

在 VS Code 中按下  + p 快速鍵,將剛剛複製的安裝指令貼上去,並按下 Enter 鍵執行安裝。

VS Code 安裝擴充功能

Step 4

過了幾秒鐘,等待安裝完成後,會出現重新啟動 VS Code 的訊息,請點選「Restart Now」重新啟動 VS Code。

VS Code 安裝擴充功能

Step 5

重新啟動 VS Code 之後,就可以使用 Python 的除錯功能了。

VS Code Python 除錯功能

在 Marketplace 上面有很多擴充功能可以使用,通常安裝幾個自己需要的功能之後,就可以讓 VS Code 變得非常實用。

佈景主題

VS Code 裡面內建十幾種佈景主題,程式設計師可以選擇選擇自己喜歡的色調。

如果感覺 VS Code 內建的佈景主題不夠的話,也可以自己安裝 ColorSublime 上的佈景主題,安裝方式請參考 VS Code 的說明

快速鍵

資深的程式設計師在使用 IDE 時,都會使用大量的快速鍵代替滑鼠,這對於程式開發的速度與效率會有顯著的提升。

Visual Studio Code 提供了非常大量的快速鍵組合,幾乎所有常用的動作都可以透過快速鍵來完成,以下是一些編輯程式碼時常用的快速鍵組合:

快速鍵功能
+ x剪下一整行(沒有選取文字的情況)。
+ c複製一整行(沒有選取文字的情況)。
+ + k刪除一整行。
+ Enter在下方插入一行。
+ + Enter在上方插入一行。
+ 將一行文字往下移。
+ 將一行文字往上移。
+ 將游標移動至檔案結尾。
+ 將游標移動至檔案開頭。
+ ]增加縮排。
+ [減少縮排。
+ f搜尋。
+ +搜尋並取代。
+ g搜尋下一個。
+ + g搜尋上一個。
+ /程式碼單行註解加入與取消切換。
+ + a區塊程式碼註解的加入與取消切換。

這裡我只列出我個人感覺比較常用的部分,其他還有非常多的快速鍵,請參考 VS Code 的說明

參考資料