[ РЕДАКТ: решено!]
См. мой ответ ниже.
[ → Исходный вопрос следует < <]
Я использую BrowserSync в режиме сервера (используя встроенный статический сервер) с GulpJS в локальном проекте, и все, кажется, работает правильно, за исключением того, что сервер BrowserSync очень медленно запускается. Сама BrowserSync, похоже, инициализируется сразу после запуска Gulp, но для запуска сервера требуется около 4-5 минут (а иногда и больше) и для возврата URL-адресов доступа. В течение этого периода все продолжает выполняться, и BrowserSync отвечает на вызовы reload() и т.д., Но доступ недоступен через обычные URL-адреса (в этом случае localhost: 3000 и localhost: 3001). После того, как URL-адреса доступа будут возвращены, сервер, казалось бы, запущен, и обновленные страницы браузераSync работают нормально и на самом деле очень быстро.
Я пробовал несколько разных конфигураций моего gulpfile.js, пытаясь разными способами инициализировать BrowserSync, различные подходы к вызову методов stream() и reload() (включая попытку базового
Я использую 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);
})