gulp-connect doesn't work on gulp watch - gulp

Question

I've just started to learn gulp and I'm trying to use gulp-connect https://www.npmjs.com/package/gulp-connect.
This is my files structure
And it's my gulpfile.js file
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']);
I don't undestand why all works correctly when I use command gulp in node.js console, but if I try to use command gulp watch I get an error in browser console
http://localhost:8080/ net::ERR_CONNECTION_REFUSED
What did I do wrong?

Answer 1

You're not running 'connect' task when running 'watch'.
Reformat your tasks like this
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']);
Go back to terminal and run
gulp watch