How to Configure Sublime Text to Open HTML File in Chrome on Build

I often use Sublime Text as my GoTo text editing tool for not so serious scripting and when I want to open HTML files in Google Chrome on a build. Here I'm sharing the procedure for how to make it work. You first need to create a "Build System" called by Sublime Text to do it. Build Systems are JSON files with the extension ".sublime-build". It allows you to run external programs from within the editor.

As per the Sublime Text Unofficial Documentation: "Build systems let you run your files through external programs, like make, tidy, interpreters and so on."

To get to the actual point of this article, to create a build system to run your HTML file in Google Chrome on build: use the following procedure.

Note: I'm using Sublime Text 3 and running Windows 7.

1. Start "Sublime Text" then from "Tools" select  "Build System" > "New Build System..." as in the following:

Start Sublime Text

2. It will open a file named "untitled.sublime-build" as in the following picture:

file named
 
3. Find "Google Chrome" in your Programs then right-click on "Properties" then select "Copy the full path of the application", it will look like this:

"C:\Users\YourUserName\AppData\Local\Google\Chrome\Application\chrome.exe"

"YourUserName" is your user account name under which you're working in Windows 7.

4. Modify the contents of the new sublime build file as below and save as "Chrome.sublime-build".

By default it shows the build directory that should be:

"C:\Users\YourUserName\AppData\Roaming\Sublime Text 3\Packages\User"

If you see any other folder then please ensure and change it to the folder above otherwise Sublime Text will not be able to see and use this build system.

And yes, don't forget to escape the backslash in the path! (highlighted in violet in the following picture):

path

5. Now since you have saved the build system as "Chrome.sublime-build" in the Build Systems directory, it will now show up in "Build System", select it:

Build Systems directory

Okay, you're all done here now. Just open any HTML file or write and save a new file as HTML and press "CTRL+B" or go to "Tools" > "Build" and it will open the HTML file in Google Chrome.

 Hope you enjoyed this article, thanks for reading :)

Up Next
    Ebook Download
    View all
    Learn
    View all