How to Run or Debug JavaScript in Sublime Text

I love Visual Studio as an IDE for most of my programming work or experiments but sometimes you have very less code to run/test/debug and for those small chunks of code it feels very costly to fire up the Visual Studio then hit F5 or CTRL + F5.

I prefer using Sublime Text as my go to text editing tool for not so serious scripting. It's a cross-platform text and source code editor, with a Python application programming interface (API). It is proprietary software but comes with an unlimited trial period. You can extend its functionality using the plugins, most of which have free-software licenses and are community-built and maintained. If you're aware of NuGet in Visual Studio then can easily understand what Package Control is for Sublime Text (navigate to the Package Control hyperlink if you don't). You can explore all the available plugins for Sublime Text here and their descriptions.

Using Sublime text for running JavaScript, it will cut down the time you will spend with Visual Studio. Follow these procedure to make your Sublime Text editor capable of running your JavaScript code in its console on a Windows Machine: (I assume you have Sublime Text installed already).

1. Download and Install NodeJS (skip this step if you already have it installed in your machine).

Install NodeJS

2. Start Sublime Text, go to Tools > Build System > New Build System:

New Build System

3. The following screen will appear:

Screen will appear

4. Replace the contents as in the following:

contents

5. Hit File > Save or CTRL + S, save the file as "JavaScript.sublime-build" in the default "user" folder. Please note that you need to start Sublime Text with administrator rights, otherwise it won't let you save this file in the default directory.

default directory

6. Close the sublime build package file that you just have created and saved. Navigate to Tools > Build System and you can see the new JavaScript build system is available in the list. Select it.

JavaScript

7. Your sublime text is now configured to run JavaScript. To test it I will quickly go and create and save a test.js file somewhere like this:

run JavaScript

8. To run these codes, Go to Tools > Build or hit CTRL+B and voila! You can see the results appear in the console down below the codes in console:

Build

9. You can see all the results, errors and console messages in this section.

errors

This is all that it takes to configure your Sublime Text to run / debug JavaScript in its console.

You can add many build systems to cater your needs. In case you want your Sublime Text to run your HTML files in Google Chrome browser, here's another article that you might want to read:

Thank you reading!

Up Next
    Ebook Download
    View all
    Learn
    View all