開発の日常

gulp で haml を使える様子にするメモ 超快適になった!

gulpimage
Pocket

hamlが使えるようになったので、さっそくgulpに追加したいと思いました。
そしたらいくつかhamlプラグインがあったので使えた一つを紹介というかメモ。

gulp-ruby-hamlをインストール

gulpの基本的な使い方は記述しません。
わかる前提で手順をメモ
gulp-detail
こちらのgulp-ruby-hamlを使います。

npm install gulp-ruby-haml --save

gulpfile.jsに記述

// 宣言
var gulp = require('gulp');
var haml = require('gulp-ruby-haml');

// hamlタスク設定
gulp.task('haml', function() {
  gulp.src('./hamlのディレクトリ/**/*.haml').
       pipe(haml()).
       pipe(gulp.dest('./書き出したいディレクトリ'));
});

// 監視設定
gulp.task('watch',function(){
  gulp.watch('./hamlのディレクトリ/**/*.haml',['haml']);
});

// 項目追加
gulp.task('default',['haml','watch']);

これでおkです。
今日からhaml使いまくって慣れていきますよ!

Pocket