创建一个使用Gulp和Livereload运行PHP的服务器

Question

我想调整此代码来提供PHP文件.我让MAMP运行本地服务器,但我无法弄清楚此代码如何工作以进行必要的更改.我知道Node服务器不会解释PHP文件,但我对这个架构使用感到困惑serve-static,serve-index因为显然我不能只使用MAMP的localhost中的本地文件路径来提供这些文件,对吧？我也想知道它为什么需要2个端口(9000和35729).

gulp.task('connect', ['styles'], function () {
  var serveStatic = require('serve-static');
  var serveIndex = require('serve-index');
  var app = require('connect')()
    .use(require('connect-livereload')({port: 35729}))
    .use(serveStatic('.tmp'))
    .use(serveStatic('app'))
    .use('/bower_components', serveStatic('bower_components'))
    .use(serveIndex('app'));

  require('http').createServer(app)
    .listen(9000)
    .on('listening', function () {
      console.log('Started connect web server on http://localhost:9000');
    });
});


gulp.task('serve', ['connect', 'watch'], function () {
  require('opn')('http://localhost:9000');
});

gulp.task('watch', ['connect'], function () {
  $.livereload.listen();

  // watch for changes
  gulp.watch([
    'app/*.php',
    '.tmp/styles/**/*.css',
    'app/scripts/**/*.js',
    'app/images/**/*'
  ]).on('change', $.livereload.changed);

  gulp.watch('app/styles/**/*.scss', ['styles']);
  gulp.watch('bower.json', ['wiredep']);
});

我基本上想用PHP来为一个网站设置模板(页脚,标题等),就像这个人发布在这里一样.

我觉得人们不再这样做了,所以欢迎使用静态资产和模板进行前端开发的任何建议(以便以后适应WordPress或其他基于PHP的CMS).

编辑

请阅读:运行BrowserSync和PHP的Gulp-webapp

Answer 1

我使用本地 PHP 安装作为服务器，然后使用“gulp-connect-php”插件启动该服务器。我还没有在 XAMPP/MAMP 中使用它，但可能您只需要将“bin”和“ini”重新定位到 XAMPP/MAMP 的 PHP 安装即可。但我没有解决方案如何将 Gulp 与数据库连接。

“gulp-connect-php”插件：

https://www.npmjs.com/package/gulp-connect-php

var gulp = require('gulp'),
    livereload = require('gulp-livereload'),
    connectPHP = require('gulp-connect-php');

gulp.task('connect', function() {
  connectPHP.server({
    hostname: '0.0.0.0',
    bin: 'C:/php/php.exe',
    ini: 'C:/php/php.ini',
    port: 8000,
    base: 'dev',
    livereload: true
  });
});

Gulp Connect 只能启动 Node 服务器（如果我没记错的话）。

端口 35729 用于 livereload javascript，您需要将其放置在 PHP、HTML 文件的底部，即放置其他脚本的位置。Grunt 也使用完全相同的代码：

<script src="//localhost:35729/livereload.js"></script>

端口 9000 可能是为 Gulp Connect 服务器定义的端口。