在 HTML、CSS 和 JavaScript 中实时编辑
借助 实时编辑 功能，您对 HTML、CSS 或 JavaScript 代码所做的更改会立即在浏览器中显示，而无需重新加载页面。
Live Edit 适用于包含或生成 HTML、CSS 或 JavaScript 的其他文件类型。 在 调试 Node.js 应用程序 时，您也可以使用 实时编辑。 如需了解更多信息，请参阅 Node.js 应用程序中的实时编辑。
默认情况下， Live Edit 仅对 HTML 和 CSS 文件启用。
开始之前
请确保在设置中已启用 JavaScript 调试器 捆绑插件。 按 Ctrl+Alt+S 打开设置，然后选择 。 点击 已安装 选项卡。 在搜索字段中，输入 JavaScript Debugger。 有关插件的更多信息，请参阅 插件管理。
请确保在设置中启用了 Live Edit 插件。 按 Ctrl+Alt+S 打开设置，然后选择 。 点击 已安装 选项卡。 在搜索字段中，输入 Live Edit。 有关插件的更多信息，请参阅 插件管理。
按照 配置 JavaScript 调试器 中的描述配置内置调试器。
要在不重新加载页面的情况下，将您对 HTML、CSS 或 JavaScript 代码所做的更改立即在浏览器中显示，请启用 Live Edit 功能。
激活并配置 JavaScript 中的 Live Edit
在 设置 对话框（Ctrl+Alt+S ），转到 。
在打开的 实时编辑 页面上，选中 更改时在 Chrome 中更新应用程序的间隔 复选框。
默认情况下，WebStorm 仅对 HTML 和 CSS 代码提供即时预览。 要在 JavaScript 中启用 Live Edit ，请选择 JavaScript、HTML 和 CSS 选项。
指定在编辑器中更改代码与在浏览器中显示这些更改之间的时间延迟：接受默认值
300 ms或使用相应字段旁边的旋转框指定自定义值。要启用由 Node.js 执行的 JavaScript 文件的重新加载，请选择 在更改时更新 Node.js 应用程序 复选框。 请使用微调框指定上传所需的时间，默认值为 300。
要在可以编译为 JavaScript、HTML 或 CSS 的代码中启用 Live Edit，例如在 TypeScript、Pug 或 SCSS 中，选择 跟踪编译为 JavaScript、HTML 或 CSS 的文件中的更改 复选框。
对于此类文件所做的所有更改会自动保存以触发编译，然后会在浏览器中显示。
请注意，更改的文件会在更新后不久 被保存 ，与常规的自动保存不同，后者是在关闭文件、项目或 WebStorm，或在其他事件触发时进行的。
要配置高亮显示，请选中 在文本光标变化时在浏览器中高亮显示当前元素 复选框。 否则，在调试会话期间，您将不得不按住 Shift 并在编辑器中将鼠标悬停在元素上以在浏览器中高亮显示它。
选中 如果 hotswap 失败，请重启 复选框，以允许 WebStorm 在无法直接应用更改的情况下自动重新加载页面。
使用 Live Edit
根据需要更新您的 HTML、CSS 或 JavaScript 代码。 更改会立即反映在浏览器中，无需重新加载页面。