How do I debug HTML and JavaScript together in VSCode (Visual Studio Code)?

It seems what I want to do is not possible in VSCode (yet?). My solution at the moment, is to use the node package live-server. Install with

> npm install -g live-server

Then open VSCode, right-click any file in the root folder of your project and select "Open in Console". Then type

> live-server

to start a server with your project as root folder. Live-server will open your default browser and also monitors your project folder for any file changes, and reloads the html page every time you do any changes.

I should mention that my solution using live-server doesn't allow me to debug my app in VSCode, only run it in the browser. I am debugging in Chrome.


It is now possible to debug Chrome web pages in vscode via Chrome remote debugging with a extension released by Microsoft. Debugger for Chrome

As you can see from that page there are two modes of debugging, Launch and Attach. I only managed to use the Attach mode, probably because i don't have a server running. This extension has all important debug tools functional: local variables, breakpoints, console, call stack.

Another reason to revisit vscode is that it now has IntelliSense support for ECMAScript 6, which displays methods not visible in other "IntelliSense like" solutions I've tried, like SublimeCodeIntel or the latest version of WebStorm.