Let’s do a walkthrough of how to install and set up LiveReload in Sublime Text 2.
The first thing to do is install a package manager in the editor. You can install plugins in Sublime Text in two ways–manually or automatically. It is easier and more convenient to use automatic installation, so I recommend using that method. Read more about how to install Package Control in Sublime Text.
Let us procced with installing the plugin LiveReload in Sublime Text 2. Navigate to Preferences > Package Control:
In the package manager menu, choose the option Package Control: Install Package from the list.
After downloading the list of packages, you will need to type the name of the package in the search box – LiveReload. Press Enter, and in a seconds the plugin will be installed. You must restart the editor to enable the plugin.
Installing LiveReload as a Chrome extension
The LiveReload plugin works “cooperatively” with a browser extension for Google Chrome that is also named LiveReload. Here is how to install this extension.
In Chrome settings, navigate to the section with extensions and type the name of the plugin in the search box – LiveReload. After that, press the “Install” button and wait until the installation is complete. You do not need to restart the browser before the extension is enabled. The toolbar will now display an icon of two circular arrows. This is the icon for the LiveReload extension. LiveReload is now properly installed.
Testing the LiveReload plugin
Open an editable HTML-file in Sublime Text 2. Then do the same in the Google Chrome browser by clicking the LiveReload icon in the toolbar. Now make sure that the status bar in Chrome says that the LiveReload plugin in the browser is successfully connected to the Sublime Text 2 editor plugin. Now you can start working. After editing and saving the code in the file, all customizations will be applied in the Chrome box.