IntelliJ IDEA
 
2023.1
Shortcuts: Windows
Get IntelliJ IDEA
You are viewing the documentation for an earlier version of IntelliJ IDEA.
  1. Non-JVM technologies
  2. Node.js
  3. Running and debugging Node.js
  4. Live Edit in Node.js applications
Ultimate

Live Edit in Node.js applications

Last modified: 21 June 2023

Required plugins:

Javascript and TypeScript, JavaScript Debugger, Node.js -  The plugins are available only in IntelliJ IDEA Ultimate, where they are enabled by default.

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 Node.js debugging session. Learn more from Live Edit in HTML, CSS, and JavaScript.

Live Edit works for other file types that contain or generate HTML, CSS, or JavaScript.

By default, Live Edit is enabled only in HTML and CSS files.

Before you start

  1. Make sure you have Node.js on your computer.

  2. Make sure the JavaScript and TypeScript, JavaScript Debugger, and Node.js required plugins are enabled on the Settings | Plugins page, tab Installed, see Managing plugins for details.

  3. Install and enable the Live Edit plugin on the Settings | Plugins page, tab Marketplace, as described in Installing plugins from JetBrains repository.

  4. Install and enable the Live Edit plugin on the Settings | Plugins page, tab Marketplace, as described in Installing plugins from JetBrains repository.

  5. Make sure the Node.js plugin is enabled in the settings. Press CtrlAlt0S to open the IDE settings and select Plugins. Click the Installed tab. In the search field, type Node.js. For more details about plugins, see Managing plugins.

Enable Live Edit

  1. Install the Live Edit plugin on the Settings | Plugins page, tab Marketplace, as described in Installing plugins from JetBrains repository.

  2. Press CtrlAlt0S to open the IDE settings and select Build, Execution, Deployment | Debugger | Live Edit.

  3. Select Update Node.js application on changes. 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.

See also

Procedures