Skip to content

Instantly share code, notes, and snippets.

@brayhoward
Created September 5, 2016 21:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save brayhoward/17f2a14d7a057dc0c2aac266756726d9 to your computer and use it in GitHub Desktop.
Save brayhoward/17f2a14d7a057dc0c2aac266756726d9 to your computer and use it in GitHub Desktop.
Gulpfile with jade support for Ionic@2.0.0
var gulp = require('gulp'),
gulpWatch = require('gulp-watch'),
del = require('del'),
runSequence = require('run-sequence'),
gulpJade = require('gulp-jade'),
jade = require('jade'),
argv = process.argv;
/**
* Ionic hooks
* Add ':before' or ':after' to any Ionic project command name to run the specified
* tasks before or after the command.
*/
gulp.task('serve:before', ['watch']);
gulp.task('emulate:before', ['build']);
gulp.task('deploy:before', ['build']);
gulp.task('build:before', ['build']);
// we want to 'watch' when livereloading
var shouldWatch = argv.indexOf('-l') > -1 || argv.indexOf('--livereload') > -1;
gulp.task('run:before', [shouldWatch ? 'watch' : 'build']);
/**
* Ionic Gulp tasks, for more information on each see
* https://github.com/driftyco/ionic-gulp-tasks
*
* Using these will allow you to stay up to date if the default Ionic 2 build
* changes, but you are of course welcome (and encouraged) to customize your
* build however you see fit.
*/
var buildBrowserify = require('ionic-gulp-browserify-typescript');
var buildSass = require('ionic-gulp-sass-build');
var buildHtml = require('ionic-gulp-html-copy');
var copyFonts = require('ionic-gulp-fonts-copy');
var copyScripts = require('ionic-gulp-scripts-copy');
var tslint = require('ionic-gulp-tslint');
var isRelease = argv.indexOf('--release') > -1;
var sequenceToRun = ['sass', 'html', 'jade', 'fonts', 'scripts'];
gulp.task('watch', ['clean'], function(done){
runSequence(
sequenceToRun,
function(){
gulpWatch('app/**/*.scss', function(){ gulp.start('sass'); });
gulpWatch('app/**/*.html', function(){ gulp.start('html'); });
gulpWatch('app/**/*.jade', function(){ gulp.start('jade'); });
buildBrowserify({ watch: true }).on('end', done);
}
);
});
gulp.task('build', ['clean'], function(done){
runSequence(
sequenceToRun,
function(){
buildBrowserify({
minify: isRelease,
browserifyOptions: {
debug: !isRelease
},
uglifyOptions: {
mangle: false
}
}).on('end', done);
}
);
});
gulp.task('sass', buildSass);
gulp.task('html', buildHtml);
gulp.task('fonts', copyFonts);
gulp.task('scripts', copyScripts);
gulp.task('clean', function(){
return del('www/build');
});
gulp.task('lint', tslint);
// Jade Support Task
var jadeConfig = {
path: 'app/**/*.jade',
dest: 'www/build',
onError: function(err) {
console.error(err.message);
this.emit('end');
}
}
gulp.task('jade', function () {
return gulp.src(jadeConfig.path)
.on('error', jadeConfig.onError)
.pipe(gulpJade({
jade: jade,
pretty: true
}))
.pipe(gulp.dest('www/build'));
});
@brayhoward
Copy link
Author

npm install --save-dev gulp-jade jade

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment