您的位置:首页 > 其它

gulp自动刷新插件

2015-02-26 17:12 274 查看
gulp自动刷新的插件很多,但是感觉最好用的还是 browser-sync 插件。如果不想用命令行,也可以使用 browser-sync界面工具

先安装 browser-sync 插件:

npm install browser-sync --save-dev


安装 browser-sync 插件可能遇到的问题 http://www.cnblogs.com/ayseeing/p/4201202.html
browser-sync API

gulpfile.js文件代码如下:

// 先引入依赖模块
var gulp = require("gulp"),
browserSync = require("browser-sync");

// 自动刷新 browser-sync start
gulp.task('browser',function(){
browserSync({
// host: 172.16.157.1,
port: 8082,
open: true,
// 路径显示/d 开始
startPath: "/d",
//timestamps:false,
server: {
directory: true,
routes: {
'/d': "./dist/new.html"
},
middleware: function(req,res,next){
console.log("中间件");
next();
},
baseDir: './'
},
// 指定浏览器
// browser: "google chrome" // 或  ["google chrome","firefox"]
// 延迟刷新,默认0
reloadDelay: 1000,
// 是否载入css修改,默认true
injectChanges: false
});
});
gulp.task('bro',function(){
gulp.src('./dist/**')
.pipe(browserSync.reload({stream:true}));
});
gulp.task('default',['bro','browser'],function(){
gulp.watch('./dist/**',['bro']);
});
// 自动刷新 browser-sync end


  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: