[gulp]gulpfile.jsテンプレ
gulpfile.jsテンプレ
https://github.com/contra/gulp-concat
https://github.com/floridoo/gulp-sourcemaps
https://github.com/floatdrop/gulp-plumber
https://github.com/mikaelbr/gulp-notify
https://github.com/dlmanning/gulp-sass
https://github.com/chilijung/gulp-cssmin
https://github.com/hparra/gulp-rename
https://github.com/terinjokes/gulp-uglify
https://github.com/hustxiaoc/gulp-minify
https://github.com/OverZealous/run-sequence
// プラグイン読み込み
var gulp = require('gulp');
var concat = require('gulp-concat');//ファイル結合
var sourcemaps = require('gulp-sourcemaps');//ソースマップ出力
var plumber = require('gulp-plumber');//エラーで処理を止めないためのプラグイン
var notify = require('gulp-notify');//エラー時通知
var sass = require('gulp-sass');//sass
var cssmin = require('gulp-cssmin');//css minify
var rename = require('gulp-rename');//ファイル名変更
var uglify = require('gulp-uglify');//js minify&難読化
//var minify = require('gulp-minify');
var runSequence = require('run-sequence');//処理順序指定用
//js結合
gulp.task('js-concat', function() {
return gulp.src(['./js.src/_intro.js',
'./js.src/_variable.js',
'./js.src/_common.js',
'./js.src/_model.js',
'./js.src/_view.article.js',
'./js.src/_outro.js'])
.pipe(plumber({
errorHandler: notify.onError("Error[js-concat]: <%= error.message %>")
}))
.pipe(sourcemaps.init())
.pipe(concat('script.js'))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./js'));
});
/*
gulp.task('js-minify',function(){
return gulp.src(['./js/script.js'])
.pipe(minify({
ext:{
min:'.min.js'
},
compress:
}))
.pipe(gulp.dest('./js'));
});
*/
//js-concatの後に実行
gulp.task('js-uglify',['js-concat'], function() {
return gulp.src(['./js/script.js'])
.pipe(plumber({
errorHandler: notify.onError("Error[js-uglify]: <%= error.message %>")
}))
.pipe(sourcemaps.init())
.pipe(uglify({
mangle :false//変数名を変えない
}))
.pipe(rename({suffix:'.min'}))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./js'));
});
gulp.task('sass', function(){
return gulp.src('./css.src/*.scss')
.pipe(plumber({
errorHandler: notify.onError("Error[sass]: <%= error.message %>")
}))
.pipe(sass({outputStyle: 'expanded'}))
.pipe(gulp.dest('./css'));
});
//sassの後に実行
gulp.task('cssmin',['sass'], function(){
return gulp.src(['./css/override.css'])
.pipe(plumber({
errorHandler: notify.onError("Error[cssmin]: <%= error.message %>")
}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('./css'));
});
// ファイルを監視して実行させる
gulp.task('watch',function() {
return gulp.watch(['js.src/*.js','./css.src/*.scss'],['build']);
});
gulp.task('build', function(callback) {
runSequence(['js-concat','js-uglify','sass','cssmin'],
'watch',
callback);
});
gulp.task('default',['build']);
concat + babel
var gulp = require("gulp");
var babel = require("gulp-babel");
var concat = require('gulp-concat');
var plumber = require('gulp-plumber');
var rename = require('gulp-rename');
var notify = require('gulp-notify');
var runSequence = require('run-sequence');
var sourcemaps = require('gulp-sourcemaps');
var dir = './src/';
//結合
gulp.task('file-concat', function() {
return gulp.src([
dir + 'parts.intro.es6',
dir + 'class.A.es6',
dir + 'class.B.es6',
dir + 'class.C.es6',
dir + 'class.D.es6',
dir + 'class.E.es6',
dir + 'init.A.es6',
dir + 'parts.outro.es6'
])
.pipe(plumber({
errorHandler: notify.onError("Error[js-concat]: <%= error.message %>")
}))
.pipe(concat('meter.es6'))
.pipe(gulp.dest(dir));
});
gulp.task('babel', function() {
return gulp.src(dir + 'result.es6')
.pipe(sourcemaps.init())
.pipe(babel({
presets: ['es2015-ie']
}))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./'));
});
gulp.task('watch', function() {
return gulp.watch(dir + '*.es6', ['build']);
});
gulp.task('build', function(callback) {
return runSequence(
'file-concat',
'babel',
'watch',
callback);
});
gulp.task('default', ['build']);
