搬运自【http://blog.csdn.net/zhu_free/article/details/51476525】

gulp-express实现实时刷新

本来使用gulp-connect可以创建本地服务器,配合Livereload就可以实现实时刷新,但express项目自带了服务器,就不太好办了,之前用了gulp-express,实现了一部分,感觉很方便,但是只有jade模板变化会实时刷新,样式表和js文件则不会,之前的部分代如下:

gulp.task('server', ['styles', 'scripts'], function() {
express.run(['./bin/www']); //启动 gulp.watch('src/scss/**/*.scss', ['styles']); //监视样式表
gulp.watch('src/js/**/*.js', ['scripts']); //监视js文件
gulp.watch('views/**/*.jade', express.notify); //监视模板文件
gulp.watch(['app.js', 'routes/**/*.js'], express.run);
}); gulp.task('default', ['server']);

  

找了一些资料提到一些gulp-livereloadconnect-livereload各种,还是没有想出来解决办法,最后忽然想到是不是gulp-express已经自带了,然后注意到express.notify这个函数貌似就是刷新的意思,于是尝试在stylesscripts方法里面结尾加上express.notify(),结果并没有什么卵用,然后试着在watch方法的callbacks列表后面加上notify:

gulp.watch('src/scss/**/*.scss', ['styles', express.notify]); //监视样式表
gulp.watch('src/js/**/*.js', ['scripts', express.notify]); //监视js文件

  

还是没有作用→_→ 
然后试着在模板文件的路径前面加上样式表和js文件的路径:

gulp.watch(['views/**/*.jade', 'src/js/**/*.js', 'src/scss/**/*.scss'], express.notify);

  

最后的解决办法是。。。代码加上了这两句

gulp.watch('public/**/*.css', express.notify);
gulp.watch('public/**/*.js', express.notify);

  

总结完整代码

gulp.task('server', ['styles', 'scripts'], function() {
express.run(['./bin/www']); //启动 gulp.watch('src/scss/**/*.scss', ['styles']); //监视样式表
gulp.watch('src/js/**/*.js', ['scripts']); //监视js文件
gulp.watch('views/**/*.jade', express.notify); //监视模板文件
gulp.watch(['app.js', 'routes/**/*.js'], express.run);
gulp.watch('public/**/*.css', express.notify);
gulp.watch('public/**/*.js', express.notify);
}); gulp.task('default', ['server']);

  

nodejs里的express自动刷新gulp-express使用【转载】的更多相关文章

  1. nodejs里的express自动刷新高级篇【转载】

    搬运自[简书:http://www.jianshu.com/p/2f923c8782c8]亲测可用哦! 最近在使用express框架及mongodb,由于前端和后端代码修改后都需要实现自动刷新功能,刚 ...

  2. 使用gulp插件来自动刷新页面。

    http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...

  3. gulp最佳实践(包含js,css,html预编译,合并,压缩,浏览器自动刷新)

    gulp是基于流的自动化构建工具官方网址:http://www.gulpjs.com.cn/ 一.安装需要的模块 1.新建package.json,输入下面的内容 { "name" ...

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

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

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

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

  6. Browsersync结合gulp和nodemon实现express全栈自动刷新

    Browsersync能让浏览器实时.快速响应你的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平板.手机等设备下进项调试. ...

  7. 浏览器自动刷新——基于Nodejs的Gulp LiveReload与VisualStudio完美结合。

    本文版权桂博客园和作者吴双共同所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/p/6016055.html 写在前面 大家好我是博客园的蜗牛,博客园的蜗牛就是我 ...

  8. gulp之压缩合并MD5清空替换加前缀以及自动编译自动刷新浏览器大全

    gulp是基于流的前端构件化工具.目前比较火的前端构建化工具还是挺多的,grunt gulp fis3等等. 这个鬼东西有什么用?请参考https://www.zhihu.com/question/3 ...

  9. gulp下livereload和webserver实现本地服务器下文件自动刷新

    一.前言 node从v0.10.26升级(为了匹配autoprefixer)到v5.3.0后出现了gulp插件兼容问题,在nodejs下各种新的插件出现问题,需要重新配置.livereload实现ch ...

随机推荐

  1. hzwer分块九题(暂时持续更新)

    hzwer分块9题 分块1:区间加法,单点查询 Code #include<bits/stdc++.h> #define in(i) (i=read()) using namespace ...

  2. 解决 cmd dos 下 无法显示中文

    在做程序开发的时候经常需要在使用命令行进行操作, dos环境本身是不支持中文的,有时候中文编码的问题就像苍蝇一样讨厌,下面提供几种常用的手段解决win7环境下中文显示乱码的问题: 方法一: 修改注册表 ...

  3. HDU2686 费用流 模板

    Matrix Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Subm ...

  4. 一图看懂深度学习框架对比----Caffe Torch Theano TensorFlow

      Caffe Torch Theano TensorFlow Language C++, Python Lua Python Python Pretrained Yes ++ Yes ++ Yes ...

  5. UVA 1648 Business Center

    https://vjudge.net/problem/UVA-1648 设上升x层,列个方程解出来,再把x带回去 #include<cmath> #include<cstdio> ...

  6. [洛谷P2596] [ZJOI2006]书架

    洛谷题目链接:书架 题目描述 小T有一个很大的书柜.这个书柜的构造有些独特,即书柜里的书是从上至下堆放成一列.她用1到n的正整数给每本书都编了号. 小T在看书的时候,每次取出一本书,看完后放回书柜然后 ...

  7. 【TYVJ】P1038 忠诚

    [算法]线段树 #include<cstdio> #include<algorithm> using namespace std; ]; ,inf=0x3f3f3f3f; in ...

  8. 爬虫--BeautifulSoup

    什么是BeautifulSoup? BeautifulSoup支持的一些解析库 基本使用 from bs4 import BeautifulSoup html =""" ...

  9. 关于js闭包官方解释庖丁解牛式理解

    闭包:是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 变量+环境 首先按这个句子主谓宾来分解.闭包是一个表达式,通常是一个函数. 这意味着第一它 ...

  10. Caffe 学习笔记1

    Caffe 学习笔记1 本文为原创作品,未经本人同意,禁止转载,禁止用于商业用途!本人对博客使用拥有最终解释权 欢迎关注我的博客:http://blog.csdn.net/hit2015spring和 ...