BrowserSync虽然这个技术不算新,但是依然有用。略微介绍下

  没有安装node,先安装node,这里不再做介绍

  安装

    npm install -g browser-sync  全局安装,方便在任意目录下启动

  所在项目中启动

    browser-sync start --server --files "**"  所有文件都检测改变刷新,并自动打开浏览器

    http://localhost:3000/ 相当于你的index.html文件,如果你的html文件夹下有个db.html,那么地址就是 http://localhost:3000/html/db.html

  去掉更新成功的 Connected to BrowserSync 提示

    其实这是browser-sync-client.js 动态生成的一个div,id名叫 __bs_notify__ ,那我们直接在在一个公共的css文件下加上以下样式代码即可去掉提示   

         #__bs_notify__{
   display: none!important;
      }

 

BrowserSync,自动刷新,解放F5,去掉更新提示的更多相关文章

  1. gulp browser-sync自动刷新插件

    很久没弄gulp了,都快忘了,今天又来温习下browser-sync 自动刷新插件,在安装的时候出现以下提示: $ npm install browser-sync --save-dev> ws ...

  2. gulp+browserSync自动刷新页面

    BrowserSync “Browsersync能让浏览器实时.快速响应您的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平 ...

  3. 使用browserSync自动刷新

    本篇主要是以 http://www.imooc.com/article/14759 为参考来写的: 已经整理到github上:https://github.com/Macaulish/gulp-Bro ...

  4. express+gulp+gulp-nodemon+browser-sync自动刷新

    express自动生成项目.不在赘述 1.在项目根目录下新建终端,依次运行如下命令 npm install gulp --save-dev npm install gulp-nodemon --sav ...

  5. gulp自动刷新插件

    gulp自动刷新的插件很多,但是感觉最好用的还是 browser-sync 插件.如果不想用命令行,也可以使用 browser-sync界面工具 先安装 browser-sync 插件: npm in ...

  6. BrowserSync 热更新的使用(保存后自动刷新)

    BrowserSync使用的优点,BrowserSync监听条件中的文件,发现更新会立刻刷新浏览器,就像 vue中的热更新一样,解放F5实现自动更新,提高开发效率, 解决了使用双屏幕时来回切换的烦恼! ...

  7. BrowserSync,调试利器--自动刷新(转

    ---恢复内容开始--- 请想象这样一个场面:你开着两个显示器,一边是IDE里的代码,另一边是浏览器里的你正在开发的应用.此时桌上还放着你的手机,手机里也是这个开发中的应用.然后,你新写了一小段代码, ...

  8. 关于KB905474正版验证补丁破解办法 KB905474是个微软操作系统正版/盗版监测间谍软件。更新安装后,右下角有个提示说“系统监测到你的操作系统是盗版”。 如果没有安装的: 在系统提示更新的时候注意看一下,如果包含有“更新KB905474”就去掉“更新KB905474”方框前的勾,点击关闭(注意如果没有去掉那个勾得话,会找不到“关闭”,而是“确定”),在不在提示我该消息前打勾。 如果已经安装

    关于KB905474正版验证补丁破解办法 KB905474是个微软操作系统正版/盗版监测间谍软件.更新安装后,右下角有个提示说“系统监测到你的操作系统是盗版”. 如果没有安装的: 在系统提示更新的时候 ...

  9. gulp+browserSync+nodemon 实现express 全端自动刷新的实践

    学习过程宝宝心里苦,不能怨政府.. 兴趣所致,一直放不下nodejs的学习,时隔多日,又把express捡起来打算重新再学学,一直没什么太大的长进,和实际的项目经验.真的醉了,太懒了. 今天在重新研究 ...

随机推荐

  1. 在C#中用静态类来扩展类的方法

    目录 在C#中用静态类来扩展类的方法 1.待扩展类 2.用于扩展的静态类中的静态方法 3 静态扩展方法的调用 4 适用场景 在C#中用静态类来扩展类的方法 1.待扩展类 private IList&l ...

  2. Django中信号signals简单使用

    在平时的开发过程中,我们会遇到一些特殊的应用场景,如果你想要在执行某种操作之前或者之后你能够得到通知,并对其进行一些你想要的操作时,你就可以用Django中的信号(signals).Django 提供 ...

  3. 为什么string是引用类型 值还不可以修改

    C#把数据类型分为值类型和引用类型.值类型操作简单,引用类型更省空间. C#一共有15个预定义类型,其中13个值类型(8个整型.2个浮点类型.decimal.bool.char),2个引用类型(str ...

  4. 如何使用JavaScript导入和导出Excel文件

    本文由葡萄城技术团队于原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. JavaScript是一个涵盖多种框架.直译式.可以轻松自定义客户端的脚本 ...

  5. Linux下无法执行tree命令问题

    Linux下不能使用tree命令,是因为没有安装命令, 执行下面代码就行了 yum install tree -y

  6. 网络虚拟化基础协议·Geneve

    [分层] 要实现网络虚拟化,最基础的技术肯定是分层(OverLay & UnderLay). ·UnderLay 中文释义中,老房子漏雨,在房子里面撑一把大雨伞,这把大雨伞就是UnderLay ...

  7. scrapy基础知识之 Scrapy-Redis分布式策略:

    Scrapy-Redis分布式策略: 假设有四台电脑:Windows 10.Mac OS X.Ubuntu 16.04.CentOS 7.2,任意一台电脑都可以作为 Master端 或 Slaver端 ...

  8. 跟着大彬读源码 - Redis 3 - 服务器如何响应客户端请求?(下)

    继续我们上一节的讨论.服务器启动了,客户端也发送命令了.接下来,就要到服务器"表演"的时刻了. 1 服务器处理 服务器读取到命令请求后,会进行一系列的处理. 1.1 读取命令请求 ...

  9. dapper支持DataSet

    在源代码中添加 /// <summary> /// describe:支持 DataSet /// </summary> /// <param name="cn ...

  10. Python C3 算法 手动计算顺序

    Python C3 算法 手动计算顺序   手动计算类继承C3算法原则: 以所求类的直接子类的数目分成相应部分 按照从左往右的顺序依次写出继承关系 继承关系第一个第一位,在所有后面关系都是第一个出现的 ...