browsersync实现网页实时刷新(修改LESS,JS,HTML时)
var gulp = require("gulp"),
less = require("gulp-less"),
browserSync = require("browser-sync"),
path = {
HTML : "html/*.html",
LESS : "less/*.less",
CSS : "css",
JS : "js/*.js"
};
gulp.task("serve", ["less", "js-watch", "html"], function() {
browserSync.init({
server : "./"
});
gulp.watch(path.LESS, ["less"]);
gulp.watch(path.JS, ["js-watch"]);
gulp.watch(path.HTML, ["html"]);
gulp.watch(path.HTML).on("change", function() {
browserSync.reload;
});
});
gulp.task("less", function() {
gulp.src(path.LESS)
.pipe(less())
.pipe(gulp.dest(path.CSS))
.pipe(browserSync.stream());
})
gulp.task("js-watch", function() {
gulp.src(path.JS)
.pipe(browserSync.stream());
})
gulp.task("html", function() {
gulp.src(path.HTML)
.pipe(browserSync.stream());
})
gulp.task("default", ["serve"])
//如果想添加对CSS的监听,想上面监听less html js 一样
//我既然用了less就不用监听css了
browsersync实现网页实时刷新(修改LESS,JS,HTML时)的更多相关文章
- react修改app.js添加中文内容后中文部分乱码解决
[问题]:配置完react后修改app.js内容时添加中文出现如下乱码的中文. [A解决]文档——文本编码——转换文本编码,在弹出窗口修改,确定,搞定 [B解决]首先在EditPlus内:工具——首选 ...
- 修改了JS代码,刷新网页后,加载的JS还是原来旧的?
本地修改JS脚本后,刷新网页看一下修改后的执行效果,结果调试显示加载的JS还是原来旧的,反复刷新均无效,郁闷! 解决办法:清理一下浏览器缓存(长经验了!) Ctrl+Shift+Del 清除G ...
- gulp 图片、样式、js、实时刷新等压缩gulpfile.js文件各个模块
1.压缩tinypng图片 gulp-tinypng-nokey,但不压缩gif格式(另外一个gulp-imagemin压缩率不高,可以压缩gif格式) // 获取 gulp var gulp = ...
- 网页实时聊天之js和jQuery实现ajax长轮询
众所周知,HTTP协议是无状态的,所以一次的请求都是一个单独的事件,和前后都没有联系.所以我们在解决网页实时聊天时就遇到一个问题,如何保证与服务器的长时间联系,从而源源不段地获取信息. 一直以来的方式 ...
- [转]网页实时聊天之js和jQuery实现ajax长轮询 PHP
网页实时聊天之js和jQuery实现ajax长轮询 众所周知,HTTP协议是无状态的,所以一次的请求都是一个单独的事件,和前后都没有联系.所以我们在解决网页实时聊天时就遇到一个问题,如何保证与服务器的 ...
- grunt实现修改代码实时刷新浏览器
grunt例子:https://github.com/Aquarius1993/gruntDemo grunt 实时刷新1: 1.安装chrome浏览器插件:liveReload ...
- gulp使用 实现文件修改实时刷新
gulp例子:https://github.com/Aquarius1993/gulpDemo 淘宝镜像:$ npm install -g cnpm --registry=https://regist ...
- js获取当前时间并实时刷新
效果如图: 代码如下: <html> <head> <title>js获取当前时间并实时刷新</title> <script> //页面加载 ...
- webpack-dev-server 搭建本地服务以及浏览器实时刷新
一.概述开发项目中为了保证上线,开发项目是都需要使用localhost进行开发,以前的做法就是本地搭建Apache或者Tomcat服务器.有的前端开发人员 对服务器的搭建和配置并不熟悉,这个时候需要后 ...
随机推荐
- amazeui折叠面板智能化展开
2016年12月12日 21:05:18 星期一 场景: 我拿这个组件用作管理后台的侧边栏 效果: 根据当前访问的url不同, 展开不同的面板 amazeui折叠面板 js代码: <script ...
- 2015 史考特(Scottrade)开户指南 + 招商银行香港一卡通汇款【图文教程】
最近刚开始炒美股.总的来说分为两步:一是开户,即选一个美股券商开设股票交易账户:二是汇款注资,把人民币换成美元转账到股票交易账户上.上述第一点其实相对简单,美股券商大多都对美国以外的外国人开放申请,且 ...
- gdb 调试多线程
基本i threads 等操作略过,只谈线程同步.异步控制: 先点到,gdb attach到主线程t1 时,所有线程都会停止,所谓同步异步效果,是指在apply continue到所有线程之后, 再切 ...
- vector
.vector是一个能够存放任意类型的动态数组,能够增加和压缩数据. .vector容器最擅长的工作是: 利用位置索引存储容器中的单个元素. 以任何顺序迭代容器中的元素. 在容器的末尾追加和删除元素. ...
- oracle中trunc()和to_char()函数用法
-----trunc(for date) select sysdate from dual; --当前时间 2016/9/7 10:32:04select trunc(sysdate) from d ...
- webstorm添加*.vue文件代码提醒支持webstorm支持es6vue里支持es6写法
本文转自:http://www.lred.me/2016/01/07/webstorm%E6%B7%BB%E5%8A%A0-vue%E6%96%87%E4%BB%B6%E6%94%AF%E6%8C%8 ...
- C#Linq技术中SelectMany(...)的内部实现推测
对于声明为:public static IEnumerable<TResult> SelectMany<TSource, TResult>(this IEnumerable&l ...
- 惊闻Java要收费之后
今天看到朋友圈里的文章 <Oracle终于要向Java的非付费用户开枪了>,被这个标题吓了一跳,还以为Java要全面收费了.又被标题党骗了. 但是仔细想想,以Oracle公司的尿性,没准哪 ...
- UVA 10692 Huge Mods(指数循环节)
指数循环节,由于a ^x = a ^(x % m + phi(m)) (mod m)仅在x >= phi(m)时成立,故应注意要判断 //by:Gavin http://www.cnblogs. ...
- Jenkins配置自动发送邮件,成功!
Jenkins自动发送邮件配置: 打开"系统管理"--"系统设置" 在"Jenkins Location"设置系统管理员地址(重要:不能省略 ...