webstorm实时预览

从 idea 换到 webstorm 了，然后弄那个实时预览，配置来配置去就是不成功，调试老是弹出一个全新的 Google 浏览器，而不是在已经打开的谷歌浏览器上调试。后来谷歌搜索了一下问题，找到了官方回复。WebStorm 2020.3 从 IDE 首选项中删除了使用扩展名进行调试的选项。

官方表示：自2017.3版起，无需扩展即可进行调试。于是我按照官方教程弄了一下。

live edit是捆绑安装的，没捆绑的插件里搜索 live edit 下载安装，配置如下图

然后配置 web 浏览器，也就是 使用默认的Chrome用户数据启动调试会话

这是下图会用到的文件路径

路径1（谷歌默认安装路径）：C:\Program Files\Google\Chrome\Application

路径2（谷歌用户数据默认路径）：C:\Users\你的电脑用户名\AppData\Local\Google\Chrome\User Data

上图第四步，记得路径2，是你自己的用户名或者是默认的Administrator

然后就配置成功了，调试的时候记得关闭谷歌浏览器，再调试，直接,快捷键 shift + F9，或者再html文件上右键调试（debug）就可以了，修改 HTML 或 CSS 或 JS 后，谷歌浏览器页面会自动刷新。