【问题标题】:Gulp watch not called from within Nodemon没有从 Nodemon 内部调用 Gulp watch
【发布时间】:2015-10-10 00:56:48
【问题描述】:

所以我的 Gulp 文件如下。

“watch”块似乎工作得非常好,并且按照预期进行。 Nodemon 的工作方式是检测文件更改并刷新服务器,这也是有效的。

但是我一辈子都无法让 Nodemon 在文件更改时调用“watch”方法。

在第 81 行,.on('start' 从 nodemon 成功调用,但 'watch' 方法内的代码从未执行。

var gulp    = require('gulp');
var gutil   = require('gulp-util');      // For logging stats and warnings
var jshint  = require('gulp-jshint');    // For checking JavaScript for warnings
var concat  = require('gulp-concat');    // For joining together multiple files
var uglify  = require('gulp-uglify');    // For minimising files
var coffee  = require('gulp-coffee');    // For compiling coffee script into js
var cofLint = require('gulp-coffeelint');// For checking coffee script for errors
var less    = require('gulp-less');      // For compiling Less into CSS
var cssLint = require('gulp-csslint');   // For checking the awesomeness of css
var minCss  = require('gulp-minify-css');// For minifying css
var uncss   = require('gulp-uncss');     // For deleting unused CSS rules
var footer  = require('gulp-footer');    // For adding footer text into files
var nodemon = require('gulp-nodemon');   // For the super cool instant refreshing server
var bSync   = require('browser-sync');   // Syncs the place between multiple browsers for dev
var es      = require('event-stream');   // For working with streams rather than temp dirs

var sourcePath  = "sources";
var destPath    = "public";
var jsFileName  = "all.min.js";
var cssFileName = "all.min.css";
var footerText  = "";


/* JavaScript Tasks */
gulp.task('scripts',  function(){
    var jsSrcPath = sourcePath + '/javascript/**/*';
    var jsResPath = destPath + '/javascript';

    var jsFromCs = gulp.src(jsSrcPath+'.coffee')// Get all coffee script
        .pipe(cofLint())                        // Check CS for errors or warnings
        .pipe(cofLint.reporter())               // Output the error results
        .pipe(coffee());                        // Convert coffee to vanilla js

    var jsFromPlain = gulp.src(jsSrcPath+'.js');// get all vanilla JavaScript

   return es.merge(jsFromCs, jsFromPlain)       // Both js from cs and vanilla js
       .pipe(jshint())                          // Check js errors or warnings
       .pipe(jshint.reporter('jshint-stylish')) // Print js errors or warnings
       .pipe(concat(jsFileName,{newLine: ';'})) // Concatenate all files together
       .pipe(uglify())                          // Minify JavaScript
       .pipe(footer(footerText))                // Add footer to script
       .pipe(gulp.dest(jsResPath));             // Save to destination
});

/* CSS Tasks */
gulp.task('styles',  function(){
    var cssSrcPath = sourcePath + '/styles/**/*';
    var cssResPath = destPath + '/stylesheet';

    var cssFromLess = gulp.src(cssSrcPath+'.less')  // Get all Less code
        .pipe(less());                              // Convert Less to CSS

    var cssFromVanilla = gulp.src(cssSrcPath+'.css');// Get all CSS

    return es.merge(cssFromLess, cssFromVanilla)    // Combine both CSS
        .pipe(cssLint())                            // Check CSS for errors or warnings
        .pipe(cssLint.reporter())                   // And output the results
        .pipe(concat(cssFileName))                  // Concatenate all files together
        .pipe(minCss({compatibility: 'ie8'}))       // Minify the CSS
        .pipe(gulp.dest(cssResPath));               // Save to destination
});


/* Configure files to watch for changes */
gulp.task('watch', function() {
    gulp.watch(sourcePath+'/**/*.{js,coffee}', ['scripts']);
    gulp.watch(sourcePath+'/**/*.{css,less}',  ['styles']);
});

/* Start Nodemon */
gulp.task('demon', function () {
    nodemon({
        script: './bin/www',
        ext: 'js coffee css less html',
        env: { 'NODE_ENV': 'development'}
    })
        .on('start', ['watch'])//TODO: ERROR: watch is never called, even though start is called
        .on('change', ['watch'])
        .on('restart', function () {
            console.log('restarted!');
        });
});


/* Default Task */
gulp.task('default', ['demon']);

有什么建议为什么会发生这种情况? 我的 Gulp 文件有问题吗?

提前致谢

(是的,我知道代码有点过度注释,我和学徒一起工作,他们更喜欢英语而不是代码;)

【问题讨论】:

    标签: javascript node.js gulp nodemon


    【解决方案1】:

    问题是 Nodemon 和 browser-sync 都需要运行。此代码有效:

    gulp.task('nodemon', function (cb) {
        var called = false;
        return nodemon({
            script: './bin/www',
            watch: ['source/**/*']
        })
            .on('start', function onStart() {
                if (!called) { cb(); }
                called = true;
            })
            .on('restart', function onRestart() {
                setTimeout(function reload() {
                    bSync.reload({
                        stream: false
                    });
                }, 500);
            });
    });
    
    gulp.task('browser-sync', ['nodemon', 'scripts', 'styles'], function () {
        bSync.init({
            files: ['sources/**/*.*'],
            proxy: 'http://localhost:3000',
            port: 4000,
            browser: ['google chrome']
        });
        gulp.watch(sourcePath+'/**/*.{js,coffee}', ['scripts']);
        gulp.watch(sourcePath+'/**/*.{css,less}',  ['styles']);
        gulp.watch("sources/**/*").on('change', bSync.reload);
        gulp.watch("views/**/*.jade").on('change', bSync.reload);
    });
    
    
    
    /* Default Task */
    gulp.task('default', ['clean', 'browser-sync']);
    

    【讨论】:

      猜你喜欢
      • 2014-06-23
      • 2015-12-25
      • 1970-01-01
      • 1970-01-01
      • 2016-11-11
      • 1970-01-01
      • 2019-06-22
      • 2020-10-22
      • 1970-01-01
      相关资源
      最近更新 更多