javascript - gulp-connect and connect.reload -


i trying set simple server test out d3.js stuff. i'm following screencast on tagtree.tv. code matches his, cannot index.html reload when make change js or sass files.

i'm new gulp far can tell things ok, that's based upon assumption call connect.reload() reload whatever browser looking @ content. should noted livereload js being inserted index.html file.

my directory structure follows:

d3play  -bower_components  -dist    -css    -scripts  - node_modules  -sass  -scripts  gulpfile.js  index.html  package.json 

my gulpfile.js looks this:

var gulp = require('gulp'),   connect = require('gulp-connect'),   traceur = require('gulp-traceur'),   sass = require('gulp-ruby-sass');  gulp.task('connect', function(){   connect.server({     livereload: true   }); });  gulp.task('reload', function(){   gulp.src('./dist/**/*.*')   .pipe(connect.reload()); });  gulp.task('sass', function(){   gulp.src('./sass/*.scss')   .pipe(sass())   .pipe(gulp.dest('./dist/css')); });  gulp.task('traceur', function(){   gulp.src('./scripts/*.js')   .pipe(traceur())   .pipe(gulp.dest('./dist/scripts')); });  gulp.task('watch', function(){   gulp.watch(['./sass/*.scss'], ['sass']);   gulp.watch(['./scripts/*.js'], ['traceur']);   gulp.watch(['./dist/**/*.*'], ['reload']); });  gulp.task('default', ['connect', 'sass', 'traceur', 'watch']); 

here simple , tested livereload solution based on connect server , connect-livereload , gulp-livereload plugins might help:

 var gulp = require('gulp'); var connect = require('connect'); var connectlivereload = require('connect-livereload'); var opn = require('opn'); var gulplivereload = require('gulp-livereload');  var config = {     rootdir: __dirname,     servingport: 8080,      // files want watch changes live reload     filestowatch: ['*.{html,css,js}', '!gulpfile.js'] }  // default task - called when run `gulp` cli gulp.task('default', ['watch', 'serve']);  gulp.task('watch', ['connect'], function () {   gulplivereload.listen();   gulp.watch(config.filestowatch, function(file) {     gulp.src(file.path)       .pipe(gulplivereload());   }); });  gulp.task('serve', ['connect'], function () {   return opn('http://localhost:' + config.servingport); });  gulp.task('connect', function(){   return connect()     .use(connectlivereload())     .use(connect.static(config.rootdir))     .listen(config.servingport); });  

Comments

Popular posts from this blog

python - mat is not a numerical tuple : openCV error -

c# - MSAA finds controls UI Automation doesn't -

wordpress - .htaccess: RewriteRule: bad flag delimiters -