ちょっとしたjsやcssのビルドにPHPを使ってみてはどうかという話。
アイディア自体は昔からありそうだけど。
gulp-spawn
そのためにうっかりgulpプラグインを書きかけたのですが、gulp-spawnで十分でした。以下はless/*.less.php
をPHPとして実行してからlessでコンパイルしてbuild/
ディレクトリに出力する例。
PHPのコードはファイルではなく標準入力から読み込んでいるので、__FILE__
が使えなかったり、require
するパスがgulpfile.jsのあるディレクトリからの相対パスになるというところに注意。
gulpfile.js
var gulp = require("gulp");
var less = require("gulp-less");
var spawn = require("gulp-spawn");
var php = function () {
return spawn({
cmd: "php",
filename: function (base, ext) {
return base + ext.replace(/\.php$/, '');
}
});
};
gulp.task("lessphp", function () {
gulp.src("less/*.less.php")
.pipe(php())
.pipe(less())
.pipe(gulp.dest("build/"));
});
less/app.less.php
<?php $font_size = 18; ?>
#header {
h1 {
font-size: <?= $font_size ?>px;
}
}
みたいな感じでlessの中にPHPを書くことができる。もちろんifやforやrequireを書いても良いです。