Visual Studio Code ♥ ES6

Visual Studio Code ♥ ES6

最近 Visual Studio Code 釋出的新版本中，加入了對於 ECMAScript 2015 （也就是大家熟知的 ES6）的語法支援，ES6 的新標準為 JavaScript 程式語言帶來了很多新的功能，許多 JavaScript 工具如 Babel，或是一些現代化的 JavaScript 引擎都已經可以使用 ES6 的標準語法來撰寫 JavaScript 程式了，這就是為什麼我們要在 Visual Studio Code 加入對 ES6 支援的原因，所以在這次更新的版本中，Visual Studio Code 就會開始認得像是 arrow functions, template string, module import/exports 等 ES6 的語法。

同時也感謝 ES6 的一些標準讓 VS Code 可以更可靠有效地實作一些像是更改名稱、語法提示（IntelliSense） 、查找定義、以及尋找參考等強化編輯器功能。

告別 ///-references

過去我們用 ///-references 這樣的語法來實作語法提示的參考，不過感謝你們寶貴的建議，我們決定著手兩項變更：您可以使用 jsconfig.json 檔案來定義專案，以及自動從專案中讀取 d.ts 檔案。

使用 jsconfig.json 檔案有兩個作用：定義編譯器參數以及包含在專案中的檔案。透過 compiler options 關鍵字來定義要使用哪一種版本的 JavaScript，由於大多數的 JavaScript 引擎預設都是使用 ES5 的標準，所以若要使用 ES6 的語法，就要在 jsconfig.json 檔案中定義，而當你在使用 CommonJS 或 RequireJS 的環境開發時，也可以在這個參數中定義模組，不過不論是 target 還是 module 選項都不是必要填寫的欄位；而 files 關鍵字可以用來列舉專案中所有的檔案，或是引入目錄下的所有檔案。

當然，VS Code 支援 jsconfig.json 中的語法提示；同樣地，我們也會在 file 區段中支援用 glob pattern 來描述要引入的檔案。順帶一提，目前 jsconfig.json 其實衍生自 TypeScript 中的 tsconfig ，而且只是它的子集合，我們希望在不久的將來可以讓這兩個檔案更加接近。

欲管理 .d.ts 檔案，你可以繼續使用 tsd 套件。

在 VS Code 中執行 Babel

VS Code 天生就與命令列主控台相結合，您可以在 VS Code 中使用 task.json 檔案來整合一些命令列工具到 VS Code 之中。下面這段範例，就是每當檔案變更時要執行的 Babel 工作  (F1 > Tasks: Configure Task Runner)。

一旦您使用 `F1 > Task:Run Build Task` 來執行 babel，它就會將 src 目錄下的所有檔案都編譯至 lib 目錄下。

等不及想嚐試了嗎？先升級您的 VS Code 至最新版，然後執行下列指令：

 git clone https://github.com/jrieken/es6-vscode-sample
cd es6-vscode-sample
npm install

這個範例中 jsconfig.json 檔案沒有 files 屬性，因為所有的 d.ts 檔案都在 src/ 目錄下被已被引入。

我們還沒結束

我們會持續投資開發資源在 JavaScript 工具上，而未來 ES6 及 ES7 持續會是很重要的議題，除此之外我們也會加強對於 AMD 及 CommonJS 的整合。

祝大家寫程式愉快！

本文翻譯自 Visual Studio Code ♥ ES6 一文。