我用
开始gulp sync
并获取
[17:14:23] Starting 'scripts'...
[17:14:23] Finished 'scripts' after 43 ms
[17:14:23] Starting 'sync'...
[17:14:23] Finished 'sync' after 20 ms
[BS] Access URLs:
--------------------------------------
Local: http://localhost:(my port)
External: http://(my internal IP address)
--------------------------------------
UI: http://localhost:(myport+n)
UI External: http://(my internal IP address)
--------------------------------------
[BS] Serving files from: public
浏览器加载页面。
我保存了一个文件但是有效。终端输出:
[17:17:22] Starting 'scripts'...
[17:17:22] Finished 'scripts' after 17 ms
[17:17:22] Starting 'scripts-watch'...
[BS] Reloading Browsers...
我再次保存文件(或保存另一个文件)
[17:18:38] Starting 'scripts'...
[17:18:38] Finished 'scripts' after 8.99 ms
注意没有重新加载浏览器消息。浏览器无法重新加载。停止吞咽并手动重新加载页面反映了这一变化。
我的gulpfle:
var gulp = require('gulp');
var jshint = require('gulp-jshint');
var less = require('gulp-less');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var react = require('gulp-react');
var minifyCSS = require('gulp-minify-css');
var browserSync = require('browser-sync').create();
gulp.task('less', function() {
return gulp.src('dev/less/*.less')
.pipe(less())
.pipe(minifyCSS())
.pipe(rename('styles.min.css'))
.pipe(gulp.dest('public/css'))
});
gulp.task('scripts', function() {
return gulp.src('dev/js/*.js')
.pipe(rename('scripts.min.js'))
.pipe(uglify())
.pipe(gulp.dest('public/js'));
});
gulp.task('build', function() {
return gulp.src('dev/components/**')
.pipe(concat('components.min.js'))
.pipe(react())
.pipe(uglify())
.pipe(gulp.dest('public/js'))
});
// Default Task
gulp.task('default', function() {
gulp.start('less');
gulp.start('scripts');
gulp.start('build');
});
gulp.task('scripts-watch', ['scripts'], browserSync.reload);
gulp.task('less-watch', ['less'], browserSync.reload);
gulp.task('build-watch', ['build'], browserSync.reload);
gulp.task('sync', ['scripts'], function() {
browserSync.init({
server: {
baseDir: "public",
index : "index.htm"
}
});
gulp.watch('dev/js/*.js', ['scripts-watch', browserSync.reload]);
gulp.watch('dev/less/*.less', ['less-watch', browserSync.reload]);
gulp.watch('dev/components/**', ['build-watch', browserSync.reload]);
});
如果重要的话,在ubuntu上使用chrome。