gulpでphpをhtmlに変換する [gulp-php2html]

このプラグインを使います

gulp-php2html
https://www.npmjs.com/package/gulp-php2html

「拡張子が.phpから.htmlに変換される」ではないです。

イメージとしては
・phpをブラウザで表示し、
・それを名前をつけて保存する。
・index.phpならindex.htmlとして保存する
・さらに.htmlへのリンクを変更する
をまとめてやってくれます。

事前準備

ディレクトリ構成

/
├ html（php→html変換されたものがここに出力されます）
├ root（変換されるphp置き場）
  └ index.php
├ package.json
└ gulpfile.js

package.json

{
    "name": "dev",
    "version": "1.0.0",
    "author": "",
    "main": "gulpfile.js",
    "license": "ISC",
    "devDependencies": {
        "gulp": "*",
        "gulp-php2html": "*"
    }
}

gulpfile.js

// 環境変数
const setting = {
	html: {
		src: "./root/*.php",
		dest: "./html"
	}
};

const gulp = require("gulp");

// phpからhtmlに変換するプラグインの読み込み
const php2html = require("gulp-php2html");

// phpからhtmlに変換するタスクを作成
gulp.task("html", () => {
	return (
		gulp
			// 変換対象のファイル
			.src(setting.html.src)
			// php→html変換
			.pipe(php2html())
			// htmlを保存
			.pipe(gulp.dest(setting.html.dest))
	);
});

// ファイルの変更を監視してタスク実行
gulp.task("watch", () => {
	gulp.watch(setting.html.src, ["html"]);
});

// gulp起動時に実行するタスク
gulp.task("default", ["watch"]);

インストール

# package.jsonの内容をもとに、gulpとプラグインをインストール
$ npm install

gulpを実行（起動）します

$ gulp
[12:19:45] Using gulpfile （ディレクトリパス）/gulpfile.js
[12:19:45] Starting 'watch'...
[12:19:45] Finished 'watch' after 9.34 ms
[12:19:45] Starting 'default'...
[12:19:45] Finished 'default' after 69

これで /rootディレクトリ内のphpファイルを編集するたびに
php→htmlに変換されて
/htmlディレクトリにhtmlファイルが出力されます。