Я установил локальную копию своего сайта Wordpress и подключился к Gulp для компиляции .less, JS и т. Д. Когда я сэкономлю свое. php обновляет браузер, но когда я сохраняю файл .less, компиляция .css компилируется, но браузер не обновляется.BrowserSync в Gulp перезагружает браузер, но в прямом эфире css не обновляет браузер
Когда я использую этот же файл gulp на другом сайте, все работает отлично.
Может ли кто-нибудь сказать мне, что может блокировать BrowserSync от обновления css изменений (но html/php меняет обновление в порядке), и повлияет на некоторые сайты, но не на другие? (Я использую OSX Yosemite & Chrome браузера FYI).
Вот мой gulpfile:
/* config */
var PROXY_ADDR = 'playitinteractive.dev',
\t ASSET_PATH = 'html/wp-content/themes/playitinteractive/assets';
\t
var globs = {
\t js: [
\t \t ASSET_PATH + '/js/src/**/*.js',
\t ],
\t less: [
\t \t ASSET_PATH + 'css/less/**/*.less',
\t ],
\t files: [
\t \t '**/.htaccess',
\t \t '**/*.+(html|php|jpg|jpeg|gif|png)',
\t ],
};
var dests = {
\t js: ASSET_PATH + '/js',
\t less: ASSET_PATH + '/css',
}
/* includes */
var gulp = require('gulp'),
\t gutil = require('gulp-util'),
\t rename = require('gulp-rename'),
\t
\t // watching
\t browserSync = require('browser-sync'),
\t \t
\t // js
\t concat = require('gulp-concat'),
\t uglify = require('gulp-uglify'),
\t ngAnnotate = require('gulp-ng-annotate'),
\t
\t // css
\t less = require('gulp-less'),
\t autoprefixer = require('gulp-autoprefixer'),
\t minifyCss = require('gulp-minify-css');
/* tasks */
gulp
\t // build
\t .task('js', function(){
\t \t return gulp.src(globs.js)
\t \t \t .pipe(concat('base.js'))
\t \t \t .pipe(ngAnnotate())
\t \t \t .pipe(gulp.dest(dests.js))
\t \t \t
\t \t \t .pipe(rename({suffix: '.min'}))
\t \t \t .pipe(uglify())
\t \t \t .pipe(gulp.dest(dests.js))
\t \t \t
\t \t \t .pipe(browserSync.reload({stream:true}));
\t })
\t .task('less', function(){
\t \t return gulp.src(globs.less.concat(['!' + ASSET_PATH + '/less/**/*.inc.less']))
\t \t \t .pipe(less())
\t \t \t .pipe(autoprefixer('last 2 versions'))
\t \t \t .pipe(minifyCss())
\t \t \t .pipe(gulp.dest(dests.less))
\t \t \t
\t \t \t .pipe(browserSync.reload({stream:true}));
\t })
\t .task('build', ['js','less'])
\t
\t
\t // watch
\t .task('js.watch', ['js'], function(){
\t \t gulp.watch(globs.js, ['js']);
\t })
\t .task('less.watch', ['less'], function(){
\t \t gulp.watch(globs.less, ['less']);
\t })
\t .task('watch', ['js.watch','less.watch'], function(){
\t \t browserSync.init({
\t \t \t files: globs.files,
\t \t \t proxy: PROXY_ADDR,
\t \t \t watchOptions: {debounce: 400},
\t \t \t ghostMode: false,
\t \t \t notify: false,
\t \t \t open: !! gutil.env.open, // call `gulp --open` to start gulp and also open a new browser window
\t \t });
\t })
\t
\t // default
\t .task('default', ['watch'])
\t
{
"devDependencies": {
"browser-sync": "^1.3.0",
"gulp": "^3.8.6",
"gulp-autoprefixer": "0.0.8",
"gulp-concat": "^2.3.4",
"gulp-less": "^1.3.3",
"gulp-minify-css": "^0.3.7",
"gulp-ng-annotate": "^0.2.0",
"gulp-rename": "^1.2.0",
"gulp-uglify": "^0.3.1",
"gulp-util": "^3.0.0"
}
}
Вы можете проверить, какова фактическая версия браузера-синхронизации, которую вы используете? Последний - 1.9.1. и это документы не отображают синтаксис 'browserSync.init'. – Heikki
http://www.browsersync.io/docs/gulp/ – Heikki