zoukankan      html  css  js  c++  java
  • 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-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']);
    

      

  • 相关阅读:
    【ADO.NET基础-GridView】GridView的编辑、更新、取消、删除以及相关基础操作代码
    【ADO.NET基础-Session】Session的基本应用
    【ADO.NET基础-数据加密】第一篇(加密解密篇)
    【ADO.NET基础知识】SqlConnection、command、DataSet 、DataTable、dataAdapter
    3、Flask实战第3天:url_for使用
    2、Flask实战第2天:URL传参
    1、Flask实战第1天:第一个Flask程序
    第5天-表单
    第4天-表格
    第3天-DIV+CSS布局
  • 原文地址:https://www.cnblogs.com/webSong/p/7429217.html
Copyright © 2011-2022 走看看