WebStorm 9 配置 Live Edit 功能与浏览器实现同步

1、 打开Chrome浏览器，点击右上角的“自定义及控制”按钮，选择“更多工具”-->”扩展程序”，打开“扩展程序”页面。

其实以上步骤可以简化为：用Chrome打开chrome://extensions/，如上图所示。

2、点击“获得更多扩展程序”，进入“Chrome网上商店”，搜索“JetBrains IDE Support”扩展程序。点击“添加至Chrome”按钮，安装该扩展程序到Chrome。勾选后面的“应用”，安装成功后Chrome浏览器工具栏上会出现一个"JB"图标。

3、打开WebStorm，新建一个Emmet.html文件，菜单Run-->Debug，然后选择“Emmet.html”，这时会同步启动Chrome打开Emmet。并且提示”JetBrains IDE Support 正在调试此标签页“。

点如下图的下拉箭头，选择Edit Configurations，打开Run/Debug Configurations对话框，你会发现已经在JavaScript Debug下新建了Emmet.html。

4、 下面开始测试，切换到WebStorm，修改Emmet.html，根本不需要保存操作，切换到Chrome，你会发现Chrome同步实时渲染好了该页面。

5、以后你可以点击如下图的工具按钮打开Chrome来实时查看渲染效果，快捷键为Shift+F9。

时间： 2024-10-11 05:22:36

WebStorm 9 配置 Live Edit 功能与浏览器实现同步的相关文章

配置apache使之支持浏览器端的缓存

当直接在浏览器中输入一个URL,或者点击一个链接的时候,那么浏览器缓存就会起作用,如果缓存没有过期,那么浏览器会从本地读取资源,不会发起HTTP请求,如果缓存过期,那么浏览器会发起新的浏览器请求. 一.适用直接访问,非F5刷新页面的情况下 Expires是HTTP/1.0的缓存头, Cache-Control: max-age 是HTTP/1.1是用来进行HTTP缓存的头.Expires指定了资源过期的绝对时间,GMT格式,Cache-Control: max-age指定了资源过期的相对时间,单

WebStorm 9 配置 svn 1.8.10

1.配置SVN SVN 服务器 VisualSVN-Server-2.7.8 SVN 客户端 Slik-Subversion-1.8.10-x64 在WebStorm中配置 file->settings->Version Contorl->subversion->Use conmand line client 设置成你的 C:\Program Files\SlikSvn\bin\svn.exe 2.连接SVN服务器 3.增加SVN代码库 4.将工程加入SVN

【从零开始学BPM，Day5】报表配置及自定义功能页面开发

[课程主题] 主题:5天,一起从零开始学习BPM [课程形式] 1.为期5天的短任务学习 2.每天观看一个视频,视频学习时间自由安排. [第五天课程] 1.课程概要 Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的"安装资料"分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&

实战使用Axure设计App,使用WebStorm开发(5) – 实现页面功能

系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使用Axure设计App,使用WebStorm开发(3) – 构建页面架构  实战使用Axure设计App,使用WebStorm开发(4) – 实现页面UI 实战使用Axure设计App,使用WebStorm开发(5) – 实现页面功能 接上一篇系列文章,在本文中,将进一步的去实现页面功能.去实现输入

WebStorm之——配置svn（插曲）

转载请注明出处:http://blog.csdn.net/l1028386804/article/details/46300481 1.下载 SlikSVN. 2.安装.路径 D:\Program Files\slik\bin. 3.在WebStorm中配置 file->settings->VersionContorl->subversion->with conmand lineclient 设置成你的 D:\ProgramFiles\slik\bin\svn.exe.

jenkins配置邮件通知功能以及破解管理员密码

笔记内容:jenkins配置邮件通知功能以及破解管理员密码笔记日期:2018-02-27 26.6 jenkins邮件设置 26.7 插件email-ext 26.8 破解jenkins管理员密码 26.6 jenkins邮件设置 打开Jenkins的web页面,点击 系统管理 -> 系统设置 -> Jenkins Location ,先设置系统管理员邮件地址,这里的系统管理员邮件地址需要和后续要设置的发送邮件的地址一致: 然后再往下拉,找到 "邮件通知" 那一栏,填写SM

张明贵-Linux文件上传下载及sCRT配置批量管理功能

[讲课:互动,用提问的方式来吸引听众的注意力,听众吸收最大化] 大学是在许昌学院读的,在我看来,不干念PPT的老师就是好讲师,因为大部分任课老师自顾自讲,没有互动,传授的知识我们只是被动的听,没有引导听课者的思考,再此吐槽一下,哈哈!我还是真心希望我的母校越来越好. 文件的上传下载 rz 上传 rz命令不存在 [[email protected] ~]# rz -bash: rz: command not found 安装 lrzsz(需要联网或配置yum源) yum install lrzsz

nginx配置让任何文件在浏览器中显示文本text/plain

例子 server { listen 81; root /var/www/applog; autoindex on; autoindex_exact_size off; autoindex_localtime on; location / { } location ~ .*/188.188.1.*/.*\.log$ { add_header Content-Type text/plain; } } 查看博文:nginx配置让任何文件在浏览器中显示文本text/plain 原文地址:http://

浅入深出Vue：工具准备之WebStorm安装配置

浅入深出Vue之工具准备(一):WebStorm安装配置 工欲善其事必先利其器,让我们先做好准备工作吧 导航篇 WebStorm安装配置 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的WebStorm 安装 下载后即可食用,此步骤与正常软件安装并无二样. 若有固态硬盘,尽可能安装在固态硬盘上,物理加速一下~ 按照自己的系统来勾选32位还是64位,若羽的机器装的是64位系统,因此勾选的是64位.另外为了防止本机没有JetBrains系列所需的JRE环境,建议直接勾选即可. 接下