Wednesday 15 January 2014

javascript - Gulp task to make a release -



javascript - Gulp task to make a release -

i'ma newbie gulp. i'm trying build release dist folder. project construction follows:

_untitled/ └── app/ └── img/ └── jade/ └── script/ └── style/ └── vendor/ └── 404.html └── index.html └── node_modules/ └── gulpfile.js └── package.json

here's gulpfile.js:

var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); //-------------------- jade gulp.task('jade', function () { homecoming gulp.src('app/jade/*.jade') .pipe($.jade({ pretty: true })) .on('error', console.log) .pipe(gulp.dest('app')) .pipe($.size()); }); //-------------------- style gulp.task('style', function () { homecoming gulp.src('app/style/sass/main.scss') .pipe($.rubysass({ style: 'expanded', 'sourcemap=none': true, nocache: true })) .pipe($.autoprefixer({ browsers: ['last 2 versions'] })) .pipe(gulp.dest('app/style')) .pipe($.size()); }); //-------------------- script gulp.task('script', function () { homecoming gulp.src('app/script/**/*.js') .pipe($.jshint()) .pipe($.jshint.reporter(require('jshint-stylish'))) .pipe($.size()); }); //-------------------- htmldist gulp.task('htmldist', function () { homecoming gulp.src('app/**/*.html') .pipe(gulp.dest('dist')) .pipe($.size()); }); //-------------------- styledist gulp.task('styledist', function () { homecoming gulp.src('app/style/**/*.css') .pipe($.concat('main.css')) .pipe($.csso()) .pipe(gulp.dest('dist/style')) .pipe($.size()); }); //-------------------- scriptdist gulp.task('scriptdist', function () { homecoming gulp.src('app/script/**/*.js') .pipe($.uglify()) .pipe(gulp.dest('dist/script')) .pipe($.size()); }); //-------------------- cleandist gulp.task('cleandist', function () { var del = require('del'); homecoming del('dist'); }); //-------------------- build gulp.task('build', ['jade', 'style', 'script']); //-------------------- builddist gulp.task('builddist', ['htmldist', 'styledist', 'scriptdist']); //-------------------- release gulp.task('release', ['cleandist', 'build', 'builddist']);

with this, when type gulp release have ok dist folder, except index.html empty , 0 kb size. , then, when seek create gulp release 1 time 1 time again (in sec time, dist folder existed), have 404.html file in dist folder , error next output:

gulp release [02:36:14] using gulpfile d:\coding\_untitled\gulpfile.js [02:36:14] starting 'cleandist'... [02:36:14] finished 'cleandist' after 52 ms [02:36:14] starting 'jade'... [02:36:15] starting 'style'... [02:36:16] starting 'script'... [02:36:17] starting 'htmldist'... [02:36:17] starting 'styledist'... [02:36:17] starting 'scriptdist'... [02:36:17] files 38 b [02:36:17] finished 'script' after 1.19 s [02:36:17] files 432 b [02:36:17] finished 'jade' after 2.88 s stream.js:94 throw er; // unhandled stream error in pipe. ^ error: enoent, chmod 'd:\coding\_untitled\dist\script\main.js'

after of this, if seek create gulp release (that in third), dist folder doesn't appear. looks task runs great (not counting empty index.html) when dist folder doesn't exist, , goes wrong. need task delete entire dist folder first, , build release. running gulp builddist separately works right (index.html normal).

this first post, i've tried best right. appreciate help.

when specify dependencies in gulp, run in parallel, not in sequence. means jade, style, , script tasks running at same time htmldist, styledist, , scriptdist tasks.

you should utilize run-sequence bundle ensure tasks run in order.

var runsequence = require('run-sequence'); gulp.task('build', function(callback) { runsequence('cleandist', 'build', 'builddist', callback); });

javascript node.js task gulp

No comments:

Post a Comment