I am happy to announce that our June release comes with support for ECMAScript 2015, better known as ES6. ES6 is a significant update to JavaScript and it brings a ton of new features to you. Using tools like Babel or modern JavaScript engines you can use ES6 already today so it’s our turn now to provide tools. With the June release VS Code does understand ES6 syntax and semantics such as arrow functions, template strings, classes, module imports/exports and many more.

Thanks to the more expressive syntax of ES6 modules, VS Code and can now reliably perform operations like rename, IntelliSense, go to declaration, and find references not only inside files, but also across the whole project.

 

Say goodbye to ///-references

You guys are giving great feedback and we heard that having to pollute each and every JavaScript file with a bunch of ///-references isn’t desired. We changed two things: You can now define a project using a jsconfig.json file and we optimistically load existing d.ts-files from you workspace.

A jsconfig.json serves two purposes as it allows you to define compiler options and a file set. Use the compiler options to define what version of JavaScript to use. Since most engines support ES5 we decided to make that the default, so get a jsconfig.json for ES6 awesomeness. In case you develop in a CommonJS or RequireJS environment you define the module in the compiler options as well. Like the target-option, the module-option isn’t mandatory. The files option allows you either enumerate all files of your project or -when omitted- to include all files from the current folder and descendants.

And “Yes” – you get IntelliSense et al when editing jsconfig.json, and “Yes Yes” – we will support glob patterns in the files-sections soon. And btw - jsconfig is a cousin of tsconfig and despite it being a subset today, expect them to become more and more similar in the future.

To manage the d.ts files you can use tsd same as before. 

 

Run Babel inside VS Code

 VS Code and the console are friends! They bond using tasks.json which allows you integrate command line tools into VS Code. The snippet below is all you need to run Babel on each file change (F1 > Tasks: Configure Task Runner).

Once in place you can start babel with the ‘F1 > Tasks: Run Build Task’ gesture and it will compile all files from the src-directory into the lib-directory.

Eager to try this at home? Update to latest and greatest and run these commands before you open the folder in VS Code:

 

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

cd es6-vscode-sample

npm install

 

This sample omits the “files” property in the jsconfig.json file since all files including the d.ts files are contained in the ‘src’ folder.

 

We are not done…

 We will continue to invest in our JavaScript tools. ES6 and also ES7 will continue to be a topic but we also look into improving support for AMD and CommonJS scenarios as well as classic JavaScript patterns.

 

Happy Coding!

Johannes Rieken - VS Code Developer