gulpfile
var gulp = require('gulp'),
autoPre = require("gulp-autoprefixer"), // ベンダープレフィックス
bSync = require('browser-sync'), // ライブリロード
plumber = require('gulp-plumber'), // 強制終了防止
sass = require('gulp-sass') // Sass
;
// ライブリロード
gulp.task('browser-sync', function() {
bSync({
server: {
baseDir: "./html"
}
});
});
gulp.task('bs-reload', function() {
bSync.reload()
});
// Sass, ベンダープレフィックス
gulp.task('sass', function() {
gulp.src('./html/scss/**/*.scss')
.pipe(plumber())
.pipe(sass({outputStyle: 'expanded'}))
.pipe(autoPre({
browsers: ['last 2 versions', 'ie 10'],
cascade: false
}))
.pipe(gulp.dest('./html/css/') )
.pipe(bSync.reload({stream:true}) );
});
// HTML
gulp.task('html', function() {
gulp.src('./html/**/*.html')
.pipe(plumber())
.pipe(gulp.dest('./html/**/*.html') )
.pipe(bSync.reload({stream:true}) );
});
// JavaScript
gulp.task('js', function() {
gulp.src('./html/**/*.js')
.pipe(plumber())
.pipe(gulp.dest('./html/js') )
.pipe(bSync.reload({stream:true}) );
});
// ファイル監視
gulp.task('default', ['browser-sync'], function() {
gulp.watch("html/**/*.scss", ['sass']);
gulp.watch("html/**/*.html", ['bs-reload']);
gulp.watch("html/**/*.js", ['bs-reload']);
});