Live Edit in HTML, CSS, and JavaScript
With the Live Edit functionality, the changes you make to your HTML, CSS, or JavaScript code are immediately shown in the browser without reloading the page. Live Edit is available only during a debugging session.
Before you start
Install the LiveEdit plugin on the Plugins settings page as described in Managing Plugins.By default, Live Edit is disabled.
To activate and configure Live Edit
In the Settings/Preferences dialog (Ctrl+Alt+S), click Debugger under Build, Execution, Deployment, and then click Live Edit. The Live Edit page opens.
Select the Update application in Chrome on changes in checkbox. This enables on-the-fly preview of HTML and CSS.
To enable Live Edit in JavaScript, select the JavaScript, HTML and CSS option.
Specify the time-delay between changing the code in the editor and showing this change in the browser: accept the default value
300 ms
or specify a custom value using the spin box next to the corresponding field.To configure highlighting, select the Highlight current element in browser on caret change checkbox. Otherwise, during a debugging session, you will have to hold Shift and click the element in the editor to highlight it in the browser.
Select the Restart if hotswap fails checkbox to allow IntelliJ IDEA to reload the page automatically if the changes couldn't be applied without that.