nodejs里的express自动刷新gulp-express使用【转载】
搬运自【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-livereload, connect-livereload各种,还是没有想出来解决办法,最后忽然想到是不是gulp-express已经自带了,然后注意到express.notify这个函数貌似就是刷新的意思,于是尝试在styles和scripts方法里面结尾加上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使用【转载】的更多相关文章
- nodejs里的express自动刷新高级篇【转载】
搬运自[简书:http://www.jianshu.com/p/2f923c8782c8]亲测可用哦! 最近在使用express框架及mongodb,由于前端和后端代码修改后都需要实现自动刷新功能,刚 ...
- 使用gulp插件来自动刷新页面。
http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...
- gulp最佳实践(包含js,css,html预编译,合并,压缩,浏览器自动刷新)
gulp是基于流的自动化构建工具官方网址:http://www.gulpjs.com.cn/ 一.安装需要的模块 1.新建package.json,输入下面的内容 { "name" ...
- gulp+browserSync+nodemon 实现express 全端自动刷新的实践
学习过程宝宝心里苦,不能怨政府.. 兴趣所致,一直放不下nodejs的学习,时隔多日,又把express捡起来打算重新再学学,一直没什么太大的长进,和实际的项目经验.真的醉了,太懒了. 今天在重新研究 ...
- express+gulp+gulp-nodemon+browser-sync自动刷新
express自动生成项目.不在赘述 1.在项目根目录下新建终端,依次运行如下命令 npm install gulp --save-dev npm install gulp-nodemon --sav ...
- Browsersync结合gulp和nodemon实现express全栈自动刷新
Browsersync能让浏览器实时.快速响应你的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平板.手机等设备下进项调试. ...
- 浏览器自动刷新——基于Nodejs的Gulp LiveReload与VisualStudio完美结合。
本文版权桂博客园和作者吴双共同所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/p/6016055.html 写在前面 大家好我是博客园的蜗牛,博客园的蜗牛就是我 ...
- gulp之压缩合并MD5清空替换加前缀以及自动编译自动刷新浏览器大全
gulp是基于流的前端构件化工具.目前比较火的前端构建化工具还是挺多的,grunt gulp fis3等等. 这个鬼东西有什么用?请参考https://www.zhihu.com/question/3 ...
- gulp下livereload和webserver实现本地服务器下文件自动刷新
一.前言 node从v0.10.26升级(为了匹配autoprefixer)到v5.3.0后出现了gulp插件兼容问题,在nodejs下各种新的插件出现问题,需要重新配置.livereload实现ch ...
随机推荐
- POJ_2112_Optimal Milking 这里有超级快的网络流板子
Description FJ has moved his K (1 <= K <= 30) milking machines out into the cow pastures among ...
- ACM.hdu1025
to get the ans of how many roads at most that can be built between two line without intersection of ...
- Qt中内存泄露和退出崩溃的问题 delete
Qt中帮程序员做了一些内存回收的事情,但正因为这些反而让对此不熟悉的人会屡屡犯错. 收录一篇不错的文章: 在C++中学习过程中,我们都知道: delete 和 new 必须 配对使用(一 一对应):d ...
- [技巧篇]12.从Spring的编码过滤器说起
有一枚学生问问了我一个问题,突然灵感爆发,他使用的Spring的过滤器,前台利用GET方式向后端发出一个请求,由于里面含有中文数据,结果在后端显示的是乱码,他问我为什么?明明在Spring里面也配了字 ...
- 【转】Pyhton 单行、多行注释符号使用方法及规范
转自:Pyhton 单行.多行注释符号使用方法及规范 python中的注释有多种,有单行注释,多行注释,批量注释,中文注释也是常用的.python注释也有自己的规范,在文章中会介绍到.注释可以起到一个 ...
- 【20161109】noip模拟赛
1.Game [题目描述] 明明和亮亮在玩一个游戏.桌面上一行有n个格子,一些格子中放着棋子.明明和亮亮轮流选择如下方式中的一种移动棋子(图示中o表示棋子,*表示空着的格子): 1) 当一枚棋子的右边 ...
- bzoj 4034: [HAOI2015]树上操作——树链剖分
Description 有一棵点数为 N 的树,以点 1 为根,且树点有边权.然后有 M 个 操作,分为三种: 操作 1 :把某个节点 x 的点权增加 a . 操作 2 :把某个节点 x 为根的子树中 ...
- 崩坏3mmd中的渲染技术研究
http://youxiputao.com/articles/11839 主要是参考该篇文章做一个微小的复盘. 漫反射与高光 文章中的漫反射与高光并不是类似于普通的 resultCol = Diffu ...
- DotNet 学习笔记 OWIN
Open Web Interface for .NET (OWIN) ----------------------------------------------------------------- ...
- Windows Server 2008 R2英文版修改桌面主题(Win7主题)
1:首先打开Server Manager(凡是不知道在那里开发均可像Win7一样在运行里面搜索) 2:然后在左边的树形菜单中选择:Feature 点击右边页面中的:Add Features 这时候会出 ...