本教程适用于WebStorm、PHPStorm

开头总结:

1. Chrome浏览器开启插件:“JetBrains IDE Support”
2. IDE开启“Live Edit”插件
3. Debug调试

一、开启Chrome插件

直接前往chrome网上应用店安装(需要科学上网):点击前往

或者下载离线安装插件:XXX

二、IDE安装Live Edit拆件

打开您的WebStorm或PHPStorm,Windows用户点击右上角File,点击Settings,或者快捷键 Crtl+Alt+S; macOS用户点击Perference....
点击Plugins,搜索Live Edit,点击Install;
之后点击Restart

三、使用Debug(调式)模式

IDE中,在您的网页文件右键,点击Debug'xxx'即可,这时你的网页就是实时预览模式了