Last Updated on 2020-09-03 by Clay

介紹
Visual Studio Code —— 這一專用於程式開發的編輯器我是久仰大名了,在同學朋友的大力推薦之下,我忍不住研究了一下這個編輯器並試用了一會兒,順手紀錄下了下載安裝的步驟以及使用的教學。
除了 Visual Studio Code 在網路上鋪天蓋地的好評如潮外,讓我心動想要開始研究它的主要原因之一是我開始對手頭上的專門用來寫程式的 IDE 開始感到不耐煩:只要我正在擴充、撰寫功能的專案檔案一大,我的 IDE 就會相當相當地卡頓,至於是哪款 IDE 我就不透露了。
聽到我有這個煩惱,一些朋友推坑了我 Visual Studio Code,說這個問題在 Visual Studio Code 上是不太容易出現的,優化得不錯。依稀記得幾年前也有朋友這樣推薦我,可是說來我也是太頑固了,那時候我堅定地拒絕了朋友的推坑:要說為什麼?因為我曾經使用過 Visual Studio(備註:VS 跟 VS Code 其實是兩回事哦!),但我對 VS 肥大的體積記憶猶新,絕對絕對,不想使用跟 VS 名字很像的 VS Code 來寫程式。
但事實證明我錯啦,VS Code 其實相當輕便,開啟快速,甚至奪得了 2019 年 StackOverflow 上的使用者統計第一名。

以 Wiki 的介紹來說,VS Code 是一個由微軟開發,支援各平台的免費程式碼編輯器,它支援測試程式、Git 版本控制、代碼補全 ...... 等等常用功能 —— 聽起來跟我在使用的 IDE 功能有八成像。
總之,VS Code 是個相當好用的開發環境這一點是絕對不會錯的。本文章以下就開始紀錄『下載安裝步驟』以及『使用 Visual Studio Code 執行一個最基本的程式』這兩件事吧。
下載安裝步驟
首先要下載 VS Code 的安裝檔,請前往其官方的下載頁面:https://code.visualstudio.com/download

然後依照自己的作業系統選擇自己所需要的版本,並在下載好後進行安裝。比如說我是 Ubuntu/Debian 系統,我應該下載 .deb 格式的安裝檔,並使用以下指令進行安裝。
sudo dpkg -i <file>.deb
安裝結束後開啟 VS Code,應該就能看到開發環境開啟的樣子。

能成功開啟後,接下來就是如何使用 VS Code 執行程式了。
使用 Visual Studio Code 執行一個最基本的程式
以下使用 Python 語言作為範例。
首先,我們需要配置 Python 的環境,也就是需要安裝 Python 的 Extension(擴充),比方說關鍵字高亮、程式碼自動補完等功能。
以下就一步步地操作。





建立好之後先使用快捷鍵 Ctrl + s 將其儲存成 test.py, .py 的副檔名會讓 Python 環境生效。(可能會需要安裝 pylint 套件)
從下圖中可以看到,已經有了 Python 關鍵字自動補完的功能了。

這裡先以最經典的 print('Hello World!') 示範。


就這樣,完成了簡單的 Python 程式開發環境配置。值得注意的是,VS Code 左下角存在著版本號,要注意是否為 Python 3 的版本,否則 print()
函式是會出錯的。(Python 2 的 print
不含括號、將來也不會再有官方更新支援,不推薦使用)

References
- https://code.visualstudio.com/docs/setup/linux
- https://code.visualstudio.com/download
- https://code.visualstudio.com/docs/python/python-tutorial