このプラグインを使います
gulp-php2html
https://www.npmjs.com/package/gulp-php2html
「拡張子が.phpから.htmlに変換される」ではないです。
イメージとしては
・phpをブラウザで表示し、
・それを名前をつけて保存する。
・index.phpならindex.htmlとして保存する
をまとめてやってくれます。
事前準備
- ディレクトリ構成
/
├ html（php→html変換されたものがここに出力されます）
├ root（変換されるphp置き場）
└ index.php
├ package.json
└ gulpfile.js
- package.json
package.json
{
"name": "dev",
"version": "1.0.0",
"author": "",
"main": "gulpfile.js",
"license": "ISC",
"devDependencies": {
"gulp": "*",
"gulp-php2html": "*"
}
}
- gulpfile.js
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ファイルが出力されます。
以上です。
ありがとうございました。