WebStorm加谷歌浏览器实时同步更新

这学期新开了一门专业课：WEB技术，所以需要学习HTML，写HTML当然是用Jetbrain家的WebStorm了！在这里强力推荐一波，学生确实可以为所欲为。不扯远了，回到正题。

前言

在使用WebStorm写HTML的时候，需要先保存（雾）然后在浏览器中刷新之后才能看见效果，感觉这样很麻烦，于是就想着能不能做到在边写的时候浏览器就可以同步显示效果，办法当然是有的了！下面听我继续扯。

教程

• 首先去谷歌应用商店中安装一个叫JetBrains IDE Support的插件。如果无法打开的话请移步传送门进行下载。

JetBrains IDE Support是一款支持编译即时显示在浏览器上调试的谷歌浏览器插件。是一款web开发人员常用的开发者插件，程序员习惯称之为JB插件。这款调试插件需要与一些开发工具结合使用，比如JetBrains公司发布的一个web开发IDE，webstorm！支持代码提示、补全、定位、与Git集成等等各种功能，已经跟传统强类型语言的开发环境感觉无多大差异！

• 然后打开WebStorm，点击File->Settings->搜索Live Edit->设置一下On changes in(ms)时间->勾选Restart if hotswap fails。我设置的是3ms。

• 在WebStorm左侧目录下，右键需要显示同步效果的HTML文件，选择Debug，注意一下不是Run，然后就可以做到实时同步了。

• 浏览器上方显示的“JetBrains IDE Support”正在调试此浏览器字样不要点击取消，不然就不能同步了。

对了，我们还可以自定义端口，Webstorm默认的是63342。

效果

补充

感谢惶心提供的方法，我们还可以在html文件头部元素中加入代码<meta http-equiv="refresh" content="3">来实现自动刷新效果，content的值可以根据实际情况设定。

The end.
2018-04-02 星期一