Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/376.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 大口浏览器同步显示;“重新加载浏览器”;在终端中,但不重新加载实际浏览器。_Javascript_Wordpress_Terminal_Gulp_Browser Sync - Fatal编程技术网

Javascript 大口浏览器同步显示;“重新加载浏览器”;在终端中,但不重新加载实际浏览器。

Javascript 大口浏览器同步显示;“重新加载浏览器”;在终端中,但不重新加载实际浏览器。,javascript,wordpress,terminal,gulp,browser-sync,Javascript,Wordpress,Terminal,Gulp,Browser Sync,我遇到了一个问题,我的任务正在按预期运行,BrowserSync似乎正在工作,但实际的浏览器没有重新加载。我在终端上收到了正确的消息,表明一切都按计划进行 我正在为本地服务器使用MAMP,该服务器正在为Wordpress构建服务。我在Mac上使用ChromeV65 下面是我的gulpfile和我的终端截图。你知道是什么导致了这个问题吗 // ==============================================================================

我遇到了一个问题,我的任务正在按预期运行,BrowserSync似乎正在工作,但实际的浏览器没有重新加载。我在终端上收到了正确的消息,表明一切都按计划进行

我正在为本地服务器使用MAMP,该服务器正在为Wordpress构建服务。我在Mac上使用ChromeV65

下面是我的gulpfile和我的终端截图。你知道是什么导致了这个问题吗

// ================================================================================================
// PLUGINS
// ================================================================================================

var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var browserSync = require('browser-sync').create();
var sass = require('gulp-sass');
var plumber = require('gulp-plumber');
var gutil = require('gulp-util');
var autoprefixer = require('gulp-autoprefixer');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var svgmin = require('gulp-svgmin');
var imagemin = require('gulp-imagemin');
var notify = require('gulp-notify');

// ================================================================================================
// DIRECTORIES
// ================================================================================================

var sassInput = 'src/scss/*.scss';
var sassModulesInput = 'src/scss/modules/*.scss';
var sassUiInput = 'src/scss/ui/*.scss';
var jsInput = 'src/js/**/*.js';
var svgInput = 'src/svg/**/*.svg';
var imgInput = 'src/img/*';

var buildDir = 'www/wp-content/themes/my-theme/'

// ================================================================================================
// SASS
// ================================================================================================

var autoprefixerOptions = {
    browsers: ['last 2 versions', '> 5%', 'Firefox ESR']
};

gulp.task('sass', function () {
    return gulp
    .src(sassInput)

    .pipe(plumber({ errorHandler: function(err) {
        notify.onError({
            title: 'Gulp error in ' + err.plugin,
            message: err.toString()
        })(err);
        gutil.beep();
    }}))
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(autoprefixer(autoprefixerOptions))
    .pipe(sourcemaps.write('maps'))
    .pipe(gulp.dest(buildDir))
    .pipe(notify('CSS compiled'));
});

// ================================================================================================
// JAVASCRIPT
// ================================================================================================

gulp.task('concat', function() {
    return gulp
    .src(jsInput)

    .pipe(plumber({ errorHandler: function(err) {
        notify.onError({
            title: 'Gulp error in ' + err.plugin,
            message:  err.toString()
        })(err);
        gutil.beep();
    }}))
    .pipe(sourcemaps.init())
    .pipe(concat('main.js'))
    .pipe(gulp.dest(buildDir))
    .pipe(uglify())
    .pipe(sourcemaps.write('maps'))
    .pipe(gulp.dest(buildDir))
    .pipe(notify('JS concatenated and minified'));
});

// ================================================================================================
// SVG
// ================================================================================================

gulp.task('svgmin', function () {
    return gulp
    .src(svgInput)

    .pipe(svgmin())
    .pipe(gulp.dest(buildDir + '/svg/'));
});

// ================================================================================================
// IMAGES
// ================================================================================================

gulp.task('imgmin', function () {
    return gulp
    .src(imgInput)

    .pipe(imagemin())
    .pipe(gulp.dest(buildDir + '/img/'))
});

// ================================================================================================
// RUN TASKS
// ================================================================================================

// INDIVIDUAL BROWSER RELOAD TASKS

gulp.task('css-watch', ['sass'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('js-watch', ['concat'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('svg-watch', ['svgmin'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('img-watch', ['imgmin'], function (done) {
    browserSync.reload();
    done();
});

gulp.task('default', ['sass', 'concat', 'svgmin', 'imgmin'], function () {

    var files = [
        'www/wp-content/themes/my-theme/**/*.php'
    ];

    browserSync.init(files, {
        proxy: 'http://my-theme:8080/'
    });

    gulp.watch(sassInput, ['css-watch']);
    gulp.watch(sassModulesInput, ['css-watch']);
    gulp.watch(sassUiInput, ['css-watch']);
    gulp.watch(jsInput, ['js-watch']);
    gulp.watch(svgInput, ['svg-watch']);
    gulp.watch(imgInput, ['img-watch']);
});


在这件事上有任何帮助都将是惊人的

您对浏览器同步选项的使用不正确。它们都应该在一个对象内。比如:

    var files = [
        'www/wp-content/themes/my-theme/**/*.php'
    ];

    browserSync.init({
        files: files,
        proxy: 'http://my-theme:8080/'
    });
见和:

创建一个对象并将其作为第一个参数传递(对于GulpJS 和正常API使用情况)