Please report any issues with the plugin on https://youtrack.jetbrains.com/issues/WEB

The Live Edit plugin is bundled with WebStorm. If you're using PhpStorm, IntelliJ IDEA Ultimate, PyCharm Professional or RubyMine, please check that the plugin installed in Preferences | Plugins. 

Live Edit

With Live Edit you can see changes you make in HTML or CSS files in the browser right away, without reloading the page.

Live Edit works as part of the JavaScript debug session:

0. Make sure the JetBrains IDE Support Google Chrome extension is installed.

1. Right-click on the HTML file in the IDE and select Debug. The file will be opened in the browser and the JavaScript debug session will start.

2. Start editing your code and you'll see the changes in the browser.

Read more about the Live Edit plugin in this blog post. 

Troubleshooting

I see the message "Internal HTTP server disabled. Cannot start internal HTTP server. Git integration, JavaScript debugger and LiveEdit may operate with errors...."

IDE failed to bind to the port 63342. Please check your firewall settings and restart the IDE.

I see the message in Chrome log: "System latest connected to xxx.xxx (127.0.0.1:63342)", but LiveEdit is not working

Probable reason: there is another instance of JetBrains IDE running so port 63342 is already bound. Please check that product name corresponds to your IDE (where "xxx" stands for the build number, e.g. "126.159").

How to configure IDE connection (IDE port)

  1. Open chrome://extensions/
  2. Scroll down to JetBrains IDE Support section, click Options.

Or right click on JB browser icon and select "Options".

You don't need to configure IDE port in most cases, but if IDE port randomized on each start, it can be useful.

How to enable logging in Google Chrome

Mac OS X: open -a "Google Chrome" --args --enable-logging --v1

How do I know what's wrong?

  1. Open chrome://extensions/
  2. Check "Developer mode" checkbox.
  3. Scroll down to JetBrains IDE Support section, click Inspect views: _generated_background_page.html.
  4. Click on the "Console" button.

Alternatively, you can enable logging via the command line.

Blog posts