gulp-pug : リクエスト時にコンパイル
お母ちゃん
2017.6.4
0
0
リクエスト時にコンパイルする設定をしたのでメモ
gulpfile.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
var pug = require('gulp-pug'); var url = require('url'); var path = require('path'); var fs = require('fs'); var pug2 = require('pug'); var dir = { dist: 'htdocs', pug: 'pug' } // リクエスト時にコンパイル処理 function pugMiddleWare (req, res, next) { const requestPath = url.parse(req.url).pathname; // .html or / で終わるリクエストだけを対象とする if (!requestPath.match(/(\/|\.html)$/)) { return next(); } const suffix = path.parse(requestPath).ext ? '': 'index.html' const htmlPath = path.join(dir.dist, requestPath, suffix); // pug のファイルパスに変換 var pugPath = path.join(dir.pug, requestPath, suffix).replace('.html','.pug'); // pugファイル読み込み var pugData = fs.readFileSync(pugPath, { encoding: 'utf-8' }, function (err, data) { }); // コンパイル const result = pug2.render(pugData, { pretty: true, basedir: dir.pug, require }) // HTML書き出し fs.writeFileSync(htmlPath, result, 'utf8'); return next(); } gulp.task('connect', function() { connect.server({ port:8001, base: dir.dist, }, function (){ browserSync({ proxy: 'localhost:8001', middleware: [pugMiddleWare] }); }); }); gulp.task('reload', function(){ browserSync.reload(); }); gulp.task('watch', function() { gulp.watch([ dir.pug + '/{,**/}*.pug' ],['reload']); }); |
