Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
131
Help us understand the problem. What is going on with this article?
@hsakurai2

gulpでphp環境 ~ gulp-connect-php ~

More than 3 years have passed since last update.

gulp環境で、PHPを使いたくて、browser-syncも使いたかった時に調べたメモ。

調べてた結果「gulp-connect-php」に行きついた。
他にもいろいろ方法はあるみたいだけど、「gulp-connect-php」はシンプルで良いと思われる。

node_modulesインストール
npm init
npm install --save-dev gulp
npm install --save-dev gulp-connect-php
npm install --save-dev browser-sync
gulpfile.jsサンプル(wwwディレクトリ内にPHPを設置)
var gulp = require('gulp'),
    connect = require('gulp-connect-php'),
    browserSync = require('browser-sync');

gulp.task('connect-sync', function() {
  connect.server({
    port:8001,
    base:'www'
  }, function (){
    browserSync({
      proxy: 'localhost:8001'
    });
  });
});

gulp.task('reload', function(){ 
  browserSync.reload();
});

gulp.task("default",['connect-sync'], function() {
  gulp.watch("./www/**/*.php",["reload"]);
});

と自分のmac環境だと動いたけど、windows環境だとうんともすんとも動かずで、
オプションにphpのexeとiniを指定出来るので、そっちを指定する方法で試したところ解決。
※このオプションのおかげでPHPのバージョン毎の環境が柔軟に作れて便利かも。

gulpfile.jsサンプル(bin指定Windowsバージョン)
var gulp = require('gulp'),
    connect = require('gulp-connect-php'),
    browserSync = require('browser-sync');

gulp.task('connect-sync', function() {
  connect.server({
    port:8001,
    base:'www',
    bin: 'C:/xamp/php/php.exe',
    ini: 'C:/xamp/php/php.ini'
  }, function (){
    browserSync({
      proxy: 'localhost:8001'
    });
  });
});

gulp.task('reload', function(){ 
  browserSync.reload();
});

gulp.task("default",['connect-sync'], function() {
  gulp.watch("./www/**/*.php",["reload"]);
});

gulpfile.jsサンプル(bin指定Macバージョン)
var gulp = require('gulp'),
    connect = require('gulp-connect-php'),
    browserSync = require('browser-sync');

gulp.task('connect-sync', function() {
  connect.server({
    port:8001,
    base:'www',
    bin: '/Applications/MAMP/bin/php/php5.6.2/bin/php',
    ini: '/Applications/MAMP/bin/php/php5.6.2/conf/php.ini'
  }, function (){
    browserSync({
      proxy: 'localhost:8001'
    });
  });
});

gulp.task('reload', function(){ 
  browserSync.reload();
});

gulp.task("default",['connect-sync'], function() {
  gulp.watch("./www/**/*.php",["reload"]);
});

勿論xamppのapacheは起動しなくても大丈夫。

他にもいろいろオプションがあるみたい。
詳しくは、「gulp-connect-phpのページ」をどうぞ。

※追記(6/17)
自分のWindows環境でデフォルト動かなかったのは、PHPにPATHが通ってなかったからでした。。
node_module内にPHPサーバーの機能が入っているのかと勘違いしました。

※追記(6/22)
Macのmamp内のPHPを指定するバージョンを追記しました。

131
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
131
Help us understand the problem. What is going on with this article?