Gulp 用browserSync吞下4个php

我是个新手。 我试着用php运行gulp js，browserSync不起作用？ 除了php和browserSync之外，所有其他任务都可以工作。 它不能用浏览器打开这里有什么问题吗？ 是否可以将php与browserSync或任何限制一起使用？ 我想使用浏览器同步与php，但似乎无法让它工作

这是我的密码

const browsersync = require("browser-sync").create();
const gulp = require("gulp");
const imagemin = require("gulp-imagemin");
const sass = require("gulp-sass");
const plumber = require("gulp-plumber");
const postcss = require("gulp-postcss");
const del = require("del");
const rename = require("gulp-rename");
const autoprefixer = require("autoprefixer");
const cssnano = require("cssnano");
const newer = require("gulp-newer");
const uglify = require('gulp-uglify');
const concat = require('gulp-concat');
const php = require('gulp-connect-php');

//Php connect
function connectsync() {
  php.server({}, function (){
   browserSync({
     proxy: 'maniadev'
       });
    });
}

// BrowserSync Reload
function browserSyncReload(done) {
    browserSync.reload();
    done();
}

// Clean assets
function clean() {
    return del(["./dist/assets/"]);
}

// Optimize Images
function images() {
 return gulp
    .src("./app/assets/img/**/*")
    .pipe(newer("./app/assets/img"))
    .pipe(
        imagemin([
            imagemin.gifsicle({ interlaced: true }),
            imagemin.jpegtran({ progressive: true }),
            imagemin.optipng({ optimizationLevel: 5 }),
            imagemin.svgo({
                plugins: [
                    {
                        removeViewBox: false,
                        collapseGroups: true
                    }
                ]
            })
        ])
    )
    .pipe(gulp.dest("./dist/assets/img"));
}

// CSS task
function css() {
    return gulp
        .src("./app/assets/sass/**/*.scss")
    .pipe(plumber())
    .pipe(sass({ outputStyle: "expanded" }))
    .pipe(gulp.dest("./dist/assets/css/"))
    .pipe(rename({ suffix: ".min" }))
    .pipe(postcss([autoprefixer(), cssnano()]))
    .pipe(gulp.dest("./dist/assets/css/"))
    .pipe(browsersync.stream());
 }

 // Transpile, concatenate and minify scripts
 function scripts() {
     return (
        gulp
        .src(["./app/assets/js/**/*"])
        .pipe(plumber())
        .pipe(uglify())
        .pipe(concat('main.min.js'))
        // folder only, filename is specified in webpack config
        .pipe(gulp.dest("./dist/assets/js/"))
        .pipe(browsersync.stream())
   );
 }

  // Watch files
    function watchFiles() {
       gulp.watch("./app/assets/scss/**/*", css);
       gulp.watch("./app/assets/js/**/*", gulp.series( scripts));
       gulp.watch(
          gulp.series(browserSyncReload)
       );
       gulp.watch("./app/assets/img/**/*", images);
       gulp.watch("./app/**/*.php", gulp.series( browserSyncReload ));
 }


 // define complex tasks
 const js = gulp.series(scripts);
 const build = gulp.series(clean, gulp.parallel(css, images, js));
 const watch = gulp.parallel(watchFiles, connectsync);

 // export tasks
 exports.images = images;
 exports.css = css;
 exports.js = js;
 exports.clean = clean;
 exports.build = build;
 exports.watch = watch;
 exports.default = build;

我在oder中用于创建php服务器的gulpfile.js（Gulp版本4.0.2）如下所示：

假设您有一个名为“dist”的文件夹，其中有一个“index.php”文件：

我希望这能帮助你作为参考。我只写了我文件中的相关部分，因为看起来你已经把剩下的工作做好了

为了使用函数而不是任务（如代码中），并查看php文件的更改，您可以执行以下操作：

假设您希望查看位于/src文件夹中的php文件，并在发生更改时修改/dist文件夹

const browsersync = require("browser-sync");
const gulp = require("gulp");
const phpConnect = require('gulp-connect-php');

//Php connect
function connectsync() {
    phpConnect.server({
        // a standalone PHP server that browsersync connects to via proxy
        port: 8000,
        keepalive: true,
        base: "dist"
    }, function (){
        browsersync({
            proxy: '127.0.0.1:8000'
        });
    });
}

// BrowserSync Reload
function browserSyncReload(done) {
    browsersync.reload();
    done();
}

function php(){
    return gulp.src("./src/**/*.php").pipe(gulp.dest("./dist"));
}

// Watch files
function watchFiles() {
    gulp.watch("src/**/*.php", gulp.series(php, browserSyncReload));
}

const watch = gulp.parallel([watchFiles, connectsync]);

exports.default = watch;

注意：“浏览器同步”仅在有标记“body”时有效

const browsersync = require("browser-sync");
const gulp = require("gulp");
const phpConnect = require('gulp-connect-php');

//Php connect
function connectsync() {
    phpConnect.server({
        // a standalone PHP server that browsersync connects to via proxy
        port: 8000,
        keepalive: true,
        base: "dist"
    }, function (){
        browsersync({
            proxy: '127.0.0.1:8000'
        });
    });
}

// BrowserSync Reload
function browserSyncReload(done) {
    browsersync.reload();
    done();
}

function php(){
    return gulp.src("./src/**/*.php").pipe(gulp.dest("./dist"));
}

// Watch files
function watchFiles() {
    gulp.watch("src/**/*.php", gulp.series(php, browserSyncReload));
}

const watch = gulp.parallel([watchFiles, connectsync]);

exports.default = watch;