看到我的答案在下面(我试图接受,但我想我不能接受我自己的答案两天).
[>>原始问题在<<] 我在服务器模式下使用browserSync(使用其内置的静态服务器)与本地项目中的GulpJS,除了browserSync服务器启动速度非常慢以外,所有内容都似乎正常工作. browserSync本身似乎在运行Gulp时立即初始化,但服务器启动大约需要4到5分钟(有时甚至更多),并返回访问URL.在此期间,一切都继续运行,browserSync响应reload()调用等等,但访问不可用通常的URL(本例中为localhost:3000和localhost:3001).一旦返回访问URL,服务器似乎已经启动,并且browserSync的页面刷新工作正常,实际上非常快速. 我尝试过几种不同配置的gulpfile.js,尝试不同的方式初始化browserSync,调用stream()和reload()方法的不同方法(包括尝试browserSync的基本Gulp / SASS“配方”)和不同的端口号,但所有配置都有同样的问题.我甚至尝试禁用我的防火墙和AV软件(Avast),但没有. 我正在运行Windows 8.1,如果这是相关的. browserSync通过NPM在本地新建到项目,并且其他目录的新鲜本地安装也具有相同的问题. NPM,Ruby,Gulp和所有模块似乎是最新的.对于什么是值得的,我所有的Ruby,Gulp和Node.js的其他经验都非常顺利,无问题.
我找不到任何其他帖子提到这个问题,并开始认为这是正常的行为.这是正常的,如果没有,有没有人有任何想法的事情尝试?由于browserSync服务器总是启动(最终),因此这个延迟不是世界的结束,但是在我的工作流程中,我宁愿修复而不仅仅是处理它,这仍然是一个扭结.
最后,这是我的gulpfile.js:
/ *文件:gulpfile.js * /
var gulp = require('gulp'),gutil = require('gulp-util');
jshint = require('gulp-jshint');
sass = require('gulp-sass');
concat = require('gulp-concat');
uglify = require('gulp-uglify');
sourcemaps = require('gulp-sourcemaps');
imagemin = require('gulp-imagemin');
browserSync = require('browser-sync').create();
gulp.task('default',['watch'],browserSync.reload);
// JSHint
gulp.task('jshint',function() {
return gulp.src('src/js/**/*.js')
.pipe(jshint())
.pipe(jshint.reporter('jshint-stylish'));
});
// Build JS
gulp.task('build-js',function() {
return gulp.src('src/js/**/*.js')
.pipe(sourcemaps.init())
.pipe(concat('main.js'))
//only uglify if gulp is ran with '--type production'
.pipe(gutil.env.type === 'production' ? uglify() : gutil.noop())
.pipe(sourcemaps.write())
.pipe(gulp.dest('public/www/js/core'));
});
// Build CSS
gulp.task('build-css',function() {
return gulp.src('src/sass/**/*.{sass,scss}')
.pipe(sourcemaps.init())
.pipe(sass()).on('error',handleError)
.pipe(sourcemaps.write()) // Add the map to modified source.
.pipe(gulp.dest('public/www/css/core'))
.pipe(browserSync.stream({match: '**/*.css'}));
});
// ImageMin
gulp.task('imagemin',function () {
return gulp.src('src/img/*')
.pipe(imagemin({
progressive: true,svgoPlugins: [{removeViewBox: false}]
}))
.pipe(gulp.dest('public/www/img'));
});
// Handle errors
function handleError(err) {
console.log(err.toString());
this.emit('end');
}
// Watch function
gulp.task('watch',function() {
browserSync.init({
server: "./public/www",//port: 3002
});
gulp.watch('src/js/**/*.js',['jshint']);
gulp.watch('src/sass/**/*.{sass,scss}',['build-css']);
gulp.watch('src/js/**/*.js',['build-js']);
gulp.watch('src/img/*',['imagemin']);
gulp.watch("public/www/css/**/*.css").on('change',browserSync.reload);
})
PS:这是我第一个关于stackoverflow的问题,我是nodejs,gulpjs和browserSync的新手,所以我希望这个问题不是完全可怕的哈哈
解决方法
我将其设置在browserSync的init中,如下所示:
browserSync.init({
server: "./public/www",online: true
});
…和延迟了!
通过browserSync文档(http://www.browsersync.io/docs/options/#option-online),将在线选项设置为true似乎会跳过在线检查.所以,我猜这个检查是不知何故造成延误的原因?对我来说似乎很奇怪,但现在工作更好.