gulpでhamlをコンパイルしたいと思っています。プラグインはgulp-haml
を使っています。
terminalでgulp haml
と打てばindex.html
ファイルが生成されるのですができたらgulp
って打っただけでコンパイルしてほしいです。
scssのコンパイルは、gulp
でコンパイル + gulp-watch
も作動し続けるのですが、hamlは毎回gulp-hamlってうった後に、gulpを起動するという二段処理でできたらまとめて行いたいです。
js
1const gulp = require('gulp'); 2const watch = require('gulp-watch'); 3const haml = require('gulp-haml'); 4const sass = require('gulp-ruby-sass'); 5const autoprefixer = require('gulp-autoprefixer'); 6const browser = require('browser-sync'); 7var plumber = require('gulp-plumber'); 8const reload = browser.reload; 9 10const SRC = './src/'; 11const PUBLIC = './public/'; 12 13// Compile Haml into HTML 14gulp.task('haml', function() { 15 gulp.src('./public/**/*.haml'). 16 pipe(plumber()) 17 pipe(haml().on('error', function(e) { console.log(e.message); })). 18 pipe(gulp.dest('./public')); 19}); 20 21// Watch for changes in Haml files 22gulp.task('watch', function() { 23 gulp.src('./public/**/*.haml'). 24 pipe(watch('./public/**/*.haml') ,['haml']). 25 pipe(haml()). 26 pipe(gulp.dest('./public')); 27}) 28 29gulp.task('haml', () => { 30 return sass('public/*.haml', { 31 style: 'compressed' 32 }) 33 .on('error', (err) => { 34 console.error('Error!', err.message); 35 }) 36 .pipe(gulp.dest(PUBLIC)) 37 .pipe(browser.reload({ 38 stream: true 39 })); 40}); 41 42 43gulp.task('server', () => { 44 browser.init(null, { 45 server: { 46 baseDir: PUBLIC 47 }, 48 notify: false, 49 open: 'external', 50 port: 8080, 51 ghostMode: false 52 }); 53}); 54 55 56gulp.task('default', ['server', 'haml',], () => { 57 gulp.watch([SRC + 'public/*.haml'], ['haml']); 58}); 59gulp.task('default', ['server', 'sass',], () => { 60 gulp.watch([SRC + 'scss/*.scss'], ['sass']); 61}); 62