2015-10-12 183 views
0

我剛開始學習gulp,我試圖使用gulp-connecthttps://www.npmjs.com/package/gulp-connect
這是我的文件結構
enter image description here吞嚥連接不起作用吞嚥手錶

它是我gulpfile.js文件

var gulp = require('gulp'), 
concatCss = require('gulp-concat-css'), 
minifyCss = require('gulp-minify-css'), 
rename = require('gulp-rename'), 
notify = require('gulp-notify'), 
autoprefixer = require('gulp-autoprefixer'), 
livereload = require('gulp-livereload'), 
connect = require('gulp-connect'); 

// server connect 
gulp.task('connect', function() { 
    connect.server({ 
    root: [__dirname], 
    livereload: true 
    }); 
}); 

// css 
gulp.task('css', function() { 
    return gulp.src('css/*.css') 
    /*.pipe(notify('Done!'))*/ 
    .pipe(autoprefixer({ 
      browsers: ['> 1%', 'IE 7'] 
     })) 
    .pipe(concatCss("style.css")) 
    .pipe(minifyCss()) 
    .pipe(rename('style.min.css')) 
    .pipe(gulp.dest('dist/')) 
    .pipe(connect.reload()); 
}); 

//html 
gulp.task('html', function(){ 
    gulp.src('index.html') 
    .pipe(connect.reload()); 
}); 

// watch 
gulp.task('watch', function() { 
    gulp.watch('css/*.css', ['css']); 
    gulp.watch('index.html', ['html']); 
}); 

// default 
gulp.task('default', ['connect', 'html', 'css', 'watch']); 

我不爲什麼已瞭解我在node.js中控制檯使用命令gulp所有工作正常,但如果我嘗試使用命令gulp watch我在瀏覽器控制檯中收到錯誤
http://localhost:8080/ net::ERR_CONNECTION_REFUSED

http://i.imgur.com/4hTYaBI.png

我做錯了什麼?

回答

0

運行'watch'時,您沒有運行'connect'任務。

重新格式化您的任務,這樣

gulp.task('watch:assets', function() { 
    gulp.watch('css/*.css', ['css']); 
    gulp.watch('index.html', ['html']); 
}); 

gulp.task('default', ['connect', 'html', 'css', 'watch:assets']); 
gulp.task('watch', ['connect', 'watch:assets']); 

回到終端,運行

gulp watch