精华内容
下载资源
问答
  • Sublime Text 3 、WebStorm配置实时刷新

    千次阅读 2017-10-18 14:54:25
    本文所用软件版本Sublime Text 3(Build 3143)、WebStorm 2017.2.4(Build #WS-172.4155.35)、Google Chrome v61.0.3163.100,其他版本软件配置过程可能不一样,请知悉!一.Google Chrome安装LiveReload插件1.下载插件...

    本文所用软件版本Sublime Text 3(Build 3143)、WebStorm 2017.2.4(Build #WS-172.4155.35)、Google Chrome v61.0.3163.100,其他版本软件配置过程可能不一样,请知悉!

    一.Google Chrome安装LiveReload插件

    1.下载插件
    LiveReload 2.1.0
    链接:http://pan.baidu.com/s/1bDvsia 密码:aphx

    2.安装插件
    (1)浏览器地址栏输入:chrome://extensions/进入拓展程序
    (2)拖拽安装
    拖拽安装
    鼠标左键选中要安装的插件,拖拽至拓展程序页面,看到“拖放以安装”时释放鼠标,就安装成功了。(小伙伴留下自己的看法,前面这句要删掉吗,我觉得有图片就够了

    打钩
    别忘了打钩哦

    二.Sublime Text 3安装LiveReload插件

    1.安装Package Control
    这里写图片描述
    ctrl+shift+p 打开命令行
    输入Package Control,按下Enter键
    首次安装插件需要该步骤,若之前已安装直接看下一步

    2.安装LiveReload插件
    (1)ctrl+shift+p 打开命令行。 输入install package,按下Enter键
    这里写图片描述
    (2)输入LiveReload,按下Enter键
    (3)安装成功后,依次点击Preferences > Package Settings > LiveReload > Settings User(首选项 > Package Settings > LiveReload > Settings User),在设置页面输入如下代码

    {
        "enabled_plugins": [
            "SimpleReloadPlugin",
            "SimpleRefresh"
        ]
    }

    (4)重启Sublime Text 3,现在插件就能用了

    3.使用LiveReload插件
    (1)Google Chrome打开正在编辑的代码,点击浏览器右上角插件按钮
    这里写图片描述这里写图片描述
    (2)在Sublime Text 3修改代码,切换到Google Chrome,你会发现网页自动刷新了

    三.Google Chrome安装JetBrains IDE Support插件

    1.下载插件
    JetBrains IDE Support 2.0.7
    链接:http://pan.baidu.com/s/1bptqJx1 密码:9sjb

    2.安装插件
    这里写图片描述
    请参考本文前面的描述

    四.WebStorm使用Live Edit功能

    这里写图片描述
    依次点击File>Setttings,搜索框输入live edit。在选择Update>Auto in(ms),点击OK保存设置

    这里写图片描述
    选中要调试的html文件右键选择Debug,这时Google Chrome会弹出该网页。在WebStorm里面修改代码,Google Chrome就可以实时刷新了

    这里写图片描述
    注意别点取消,那样就不能实时刷新了

    总结下:Sublime Text3安装东西要麻烦些,不过安装好了直接就可以用。而WebStorm虽然安装方便,不过每次使用都要右键Debug比较折腾人。对比下来,我个人更喜欢用Sublime Text3写代码!

    展开全文
  • 你要使用谷歌浏览器,然后你安装一个插件,这个插件叫做:JetBrains...然后你的webstorm就会有这个: 超级好用,再也不要写完代码,在刷新下浏览器了,你可以左边写代码,右边看结果,或者弄个显示器,超级舒适。 ...

    你要使用谷歌浏览器,然后你安装一个插件,这个插件叫做:JetBrains IDE Support

    在这里插入图片描述
    然后你的webstorm就会有这个:
    在这里插入图片描述
    超级好用,再也不要写完代码,在刷新下浏览器了,你可以左边写代码,右边看结果,或者弄个显示器,超级舒适。

    展开全文
  • WebStorm8.0.3 Live Edit与Google浏览器实时刷新自动加载页面 摘要WebStorm自身就不需要Ctrl+S进行保存,再结合Live Edit,直接一边写代码一边实时查看!再不需要Ctrl+S,F5! 在WebStorm8中是自带...

    WebStorm8.0.3 Live Edit与Google浏览器实时无刷新自动加载页面

    摘要 WebStorm自身就不需要Ctrl+S进行保存,再结合Live Edit,直接一边写代码一边实时查看!再不需要Ctrl+S,F5!

     

    在WebStorm8中是自带Live Edit功能的,只是默认没有开启;

    1、Ctrl + Alt + S --> Live Edit --> 勾选 Enable live editing,如下图:

    2、接下来就是要在Google浏览器中安装 JetBrains IDE Suport 扩展,这里直接给出地址啦:

        https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji

    安装好之后在地址栏的右边会有一个JB的小图标,如果单击这个小图标可以切换到WebStorm的页面中;

    右击--选项,可以设置监听的地址和端口,WebStorm默认的是63342端口;

    3、最后,要实现在WebStorm中编辑代码,而不刷新浏览器自动实时更新,需要在WebStorm中开启Debug模式打开页面,直接在Project面板右击页面选择Debug就行啦

    好啦,一切OK啦,现在在WebStorm修改,然后切换到Google查看一下,是不是已经同步过来啦;浏览器上面的黄色背景提示条一定不能关闭,关闭了就不会实时同步啦。

    转载于:https://www.cnblogs.com/wzzl/p/4608104.html

    展开全文
  • 使用webstorm和Chrome配合,实现实时刷新, 使用过webstorm的都知道,自身不需要Ctrl+S进行保存的,这里再结合Live Edit,可以实现一边写代码,一边实时查看。 1,第一步因为在webstorm中自带的Live Edit功能是默认...

    使用webstorm和Chrome配合,实现实时刷新,

    使用过webstorm的都知道,自身不需要Ctrl+S进行保存的,这里再结合Live Edit,可以实现一边写代码,一边实时查看。

    1,第一步因为在webstorm中自带的Live Edit功能是默认关闭的,所以第一步要打开
    不知道怎么打开的看在下图 这里可以设置开关
    图片中我的已经打开了,时间单位是毫秒,可以自由修改,我比较懒,所以就没有更改,而且还可以设置只同步HTML和CSS还是HTML和CSS还有js一起同步,这个根据需要自行选择,我在这里选择了三个,在上面还有一个选项是Node.js的,需要了自行打钩。
    2,第二步就是要在Chrome浏览器中安装JetBrains IDE Suport 扩展插件,
    安装好之后在地址栏的右边或者在插件管理里面会有一个JB的小图标,如果需要设置端口和地址,可以找到选项进行设置,webstorm默认的是63342端口,不需要修改
    3最后一步.右键需要实时刷新的文件,选择红色圈内这一项,如果地址栏弹出黄色警示框,不要关闭,否则会停止实时刷新。以前按F12或者Ctrl+shift+i会关闭实时刷新,现在不会了。右键需要实时刷新的文件,选择圈内这一项

    最后多说一句,如果谷歌浏览器没有登录,没有翻墙的话是无法下载插件的,不过,我想作为一个开发人员,这个不是事。

    展开全文
  • WebStorm如何让浏览器实时更新

    万次阅读 2017-03-03 16:40:08
    webstorm绑定谷歌浏览器实时刷新 WebStorm8.0.3 Live Edit与Google浏览器实时无刷新自动加载页面 摘要 WebStorm自身就不需要Ctrl+S进行保存,再结合Live Edit,直接一边写代码一边实时查看!再不需要...
  • 摘要: WebStorm自身就不需要Ctrl+S进行保存,再结合Live Edit,直接一边写代码一边实时查看!再不需要Ctrl+S,F5! 在WebStorm8中是自带Live Edit功能的,只是默认没有开启; 1、Ctrl + Alt + S --> Live ...
  • 【1】打开webstorm→Ctrl + Alt + S→在搜索框输入:live edit,并且进行如下设置,设置完成点击右下角“OK”按钮: 【2】在Google浏览器中安装JetBrains IDE Suport 扩展程序,具体为: ... 【3】在WebSto...
  • 网页调试实时刷新谷歌插件LiveReload

    千次阅读 2017-08-01 10:25:41
    今天再给大家普及一款前端调试专用插件,谷歌的 liveReload,这东西是干嘛用的呢? 我们知道编辑器,比如我用的webstorm,或者你们的submit,等等,在编写scss的...LiveReload插件能对浏览器进行实时刷新,也就是说每在
  • webstorm 和 idea编辑器

    2018-03-06 10:28:00
    webstorm中自动编译less文件输出css为指定路径 ...webstorm 实时调试刷新浏览器 https://www.cnblogs.com/xxx91hx/p/6554835.html 转载于:https://www.cnblogs.com/hukeer/p/8512908.html...
  • WebStorm10.0.3 live Edit与Google浏览器实时刷新自动加载页面 Webstorm中的配置 点击: File->Settings->Build,Execution,Deployment->Debugger->Live Edit 在Google浏览器中安装JetBrains IDE Su.....
  • 以下,仅目前为止个人的观点,根据自己喜好: ...后来又尝试过brackets,brackets界面要比webstorm美观个人感觉,最大的优势可以实时预览吧,编辑完成后保存,网页会自动刷新。但是最近咧,又回归到了websto...
  • webstorm使用插件 statistic 统计代码

    千次阅读 2020-05-09 09:27:28
    一、插件下载 ...点击左上角的Refresh,即可刷新查看实时数据 刷新完就可以看到这个项目当前的代码统计了。 也可选中某个文件夹, 点击 Refresh on selection 查看当前选中的 这个插件:CClines也是可
  • 我开发RN项目的开发工具是webstorm 安卓模拟器是用的genymotion 在webstorm中通过npm启动项目之后,在模拟器上也成功进入了...用IntelliJ IDEA开发web项目中就有实时更新代码的功能,然后浏览器上F5刷新一下就有了。
  • Egg Error

    2020-05-27 13:27:32
    关键词:热更 自动重启 实时生效 更新失效 若使用WebStorm等JetBrain系列的IDE,则需在【设置】>【系统设置】中关闭“Use "safe write"”选项。 使用WebStorm IDE打开文件显示“ESLint: TypeError: this....
  • 本篇教程就是为了解决此问题,使用此插件之后,在编辑器中修改完代码浏览器会自动刷新实时看到效果。 2. 如果您的项目是用vue-cli脚手架开发的,或者您使用的编辑器是webstorm、hbuilderX,请忽略本篇(因为它们...
  • IDE :jetbraints webstorm 5.0.1  jdk :jdk1.6.0_31 3d :three.js 目的:获取股市数据,以3d的方式展示出来。 目的1:获取股票名称列表、代码列表和总股本列表 目的2:获取每一只股票的历史收盘数据,日线。 ...
  • WePY Plugin For IntelliJ Platform - 让PhpStorm/WebStorm全面支持WePY的开发,包括API(原生/WePY)和组件(官方/自定义)的自动完成/错误检查/高亮/不依赖Vue/... wxml - vscode插件--微信小程序格式化以及高亮组件...

空空如也

空空如也

1
收藏数 20
精华内容 8
关键字:

webstorm实时刷新