Visual Studio Code 1.12 | Review | Editor 編輯者 #10

Visual Studio Code 1.12 | Review | Editor 編輯者 #10
Hey 大家好,歡迎收看這一期的 Editor,我是 Aaron,微軟在上週發佈了 vscode 1.12 版,下面影片我們就來看看這一版的 vscode 多了哪些新的功能

JavaScript 型別檢查

我覺得這一版的更新應該要跟微軟在四月底發佈的 TypeScript 2.3 版一起來講大家會更加清楚這次 vscode 更新功能面上的脈絡。

那麼TypeScript 在 4 月底發佈 2.3 版,本來我沒有太在意,因為我本身主要沒有在寫 TypeScript,平時工作就是 CoffeeScript 跟純 JavaScript/ES6 這樣,但是當時我稍微喵了一下 TypeScript 的 release note,而 2.3 版最主要的功能呢,完全吸住我的目光齁,那就是 TypeScript 2.3 的 runtime 提供了對 JavaScript 做型別檢查的功能。誒,注意唷,是一般的 JavaScript。

所以你只要在你的 JavaScript 裡面有正確的用 JSDoc 的格式來描述你的原始碼,像是參數函數的型別,function 回傳的型別等等,或是你一開始定義變數的時候那麼 TypeScript 提供的這個 checkJS,就可以讓更廣大的 JavaScript 開發者也能夠體驗 TypeScript 這些靜態分析、型別檢查對開發所帶來的好處,讓你可以更迅速即時的在開發階段就發現原始碼撰寫上的問題。

現在 tsc 也可以對 js 檔案做型別檢查了

那麼如上所說呢, 這一次 VScode 1.12 也更新到了 TypeScript 2.3 版,現在你只要在 js 檔案中的最上方加入 //@ts-check 這個 annotation,並且在你的 source code 中加入一些 JSDoc 對 function 的定義,那你就可以馬上地來體驗 ts-check 的功能,那我相信這個對於不管你是 NodeJS 的開發者,或是前端工程的開發者,在開發效能上都會有很大的幫助。

VSCode 直接整合了 tsc checkJS 功能

Workbench 配色

接下來還記得我們上個月 vscode 1.11 版 review 中所提到的 Preview 功能: Workbench Theming 嗎?那麼在這一版在修正了一些問題與 bug 之後呢,微軟也正式的宣布 Workbench Theme 已經是 Ready To Use 的狀態了,內建的很多配色都已經加入了 workbench color,相信接下來我相信陸陸續續應該會有很多第三方的 Theme 開始加入 Workbench 的配色,這邊推薦幾個第三方的 Theme 像是 Dracula 或是 One Dark Pro 都已經有支援了。

One Dark Pro Theme
Dracula Theme

支援更多的 VCS

另外呢其實我們在上次介紹 GitLens 的影片中的資訊卡中有稍微提到,vscode 自三月公開了 Source Code Control API 之後呢,就有越來多支援不同版控系統的 Extensions 也陸續更新上架了,包含了像是 
Visual Studio Team Services Extension 也支援了 Team Foundation Version Control 、Mercurial Source Control (Hg) 的 Extension 也上架了等等。 那麼有在使用這些版本控制系統的團隊,也可以陸陸續續的加入到 vscode 使用者的行列了。

macOS native tab

接下來是 macOS 的使用者相關的一個更新,那麼由於 vscode 將 electron framework 更新到了 1.6.6 版的關係,現在 vscode 在 macOS 上終於支援了 tab window 的功能讓你可以用分頁的方式來開啟新的 vscode window 了,在開啟多個 workspace window 時就不用面對多個 vscode 視窗,可以更精簡你的畫面了,你只要在設定中將 window.nativeTabs 設為 true,並且在 macOS 的系統偏好設定的 Dock 選項中呢,將打開文件時偏好標籤頁設定呢,設定為總是(always),那麼當你使用 vscode 點擊 File 選單 New Window 或是按下 Shift+Cmd+N 開啟新視窗時,就會以新的 Tab 來開啟視窗,那麼也別忘了按下在 View 選單之中 Show Tab Bar 來顯示視窗的標籤。

這一期的 Editor 就到這邊,感謝您的收看,如果喜歡這次的影片的話,可以在下面按個讚跟分享,也別忘了訂閱我的頻道,編輯者我們下次見!