I'm using script like this:
run.js:
var gulp = global.gulp = require('gulp');
require('./gulpfile.js');
//interaction
gulp.start('zip');
gulpfile.js:
global.gulp = global.gulp || require('gulp');
gulp.task('zip', function () {});
And start: node run.js
I need it because I need collect some data via inquirer.prompt() before task start.
Everything works, but console freeze cursor after script end(in PHPStorm).
I don't understand why. If I run task via gulp, it's ok.
As mentioned by Aperçu in the comments, try letting gulp know that you're done your task.
Change
gulp.task('zip', function () {});
to
gulp.task('zip', function (done) {done()});
Related
I've created the file gulp.js, the code is below.
When I type gulp sass or node gulp sass or node gulp.js, nothing happens in node (it is supposed to print 10).
What am I doing wrong?
var gulp = require('gulp');
var sass = require('gulp-sass');
gulp.task('sass', function(){
console.log(10);
})
Change task name to sass-task and then try gulp sass-task
I'm setting up a Backbone project and I use Gulp to run some tasks. I have encountered a stdout maxBuffer error when running my task with Browserify and gulp-compressor. So, in my app.js I have the following:
var Backbone = require('backbone');
var _ = require('underscore');
var $ = require('jquery/dist/jquery');
Then I've written a task to compile the required libraries into one file, which I will use in my index.html like <script src="dist/bundle.min.js"></script>, and to minify that file using gulp-compressor. Here is the task:
var gulp = require('gulp'),
browserify = require('gulp-browserify'),
compress = require('gulp-compressor'),
rename = require('gulp-rename');
gulp.task('browserify', function() {
gulp.src('app/javascripts/app.js')
.pipe(browserify({
insertGlobals: true,
debug: !gulp.env.production
}))
.pipe(compress())
.pipe(rename('bundle.min.js'))
.pipe(gulp.dest('dist'));
});
But every time I try to run the script it returns me
Error: Error: stdout maxBuffer exceeded
How could I solve that problem?
After some search in Google the Almighty I found an answer on gulp-compressor issue tracker. To solve this problem, one should give the following parameters to compress function:
// ...
.pipe(compress({
'executeOptions': {
maxBuffer: 10000*1024
}
}))
then run $ npm update and everything will work!
I'm using the del package in my gulpfile as part of a clean task.
Below are the the versions of things I'm using
Visual Studio 2015 Community
Node.js v2.11.3
gulp v3.9.0
del v2.0.2
This is an extract from my gulp file:
var gulp = require('gulp');
var del = require('del');
var config = require('./gulp.config')();
var $ = require('gulp-load-plugins')({ lazy: true });
gulp.task('images', ['clean-images'], function () {
log('Copying and compressing the images');
return gulp
.src(config.images)
.pipe($.imagemin({optimizationLevel: 4}))
.pipe(gulp.dest(config.build + 'images'));
});
gulp.task('clean-images', function (done) {
clean(config.build + 'images/**/*.*', done);
});
function clean(path, done) {
log('Cleaning: ' + $.util.colors.blue(path));
del(path, done);
}
When I run the task images from the command prompt using gulp images the clean-images task executes but never finishes. It errors with the lines:
[16:10:45] Using gulpfile ~\Documents\Visual Studio 2015\Projects\**\Gulpfile.js
[16:10:46] Starting 'clean-images'...
[16:10:46] Cleaning: build/images/**/*.*
Process terminated with code 0.
As a result the rest of the images task doesn't execute.
The images task runs fine when I remove the clean-images dependency.
Don't suppose anyone has seen this issue before, and knows how to correct it?
Thanks
I think you've encountered the same error as this user : the del module doesn't use callbacks anymore, but promises. done is never called, so the clean and images task run concurrently, which causes an error.
You could just return from the clean method :
gulp.task('clean-images', function () {
return clean(config.build + 'images/**/*.*');
});
function clean(path) {
log('Cleaning: ' + $.util.colors.blue(path));
return del(path);
}
I'm running gulp 3.9.0 and calling some gulp commands from Visual Studio 2013. The flow is such that whenever I build in VS, gulp should clean my temporary and output files, then after a successful build, compile my javascript assets into one file.
The problem is that, I've noticed that after running "gulp build", sometimes my assets are not generated at all. This even happens on the command line. After running "gulp clean" (which removes the output), I have to run "gulp build" twice just to see the output materialize. It's as if gulp is failing silently. Not sure if this is an issue with Node running on Windows or if I have misconfigured something.
Note that VS is responsible for compiling all TypeScript files into a single .js in the \output folder.
Apologies in advanced if there is a better way to do what I'm trying to do. Still a gulp/node newbie.
VS Pre-Build:
gulp clean
VS Post-Build:
gulp build
gulpfile.js:
var gulp = require('gulp');
var del = require('del');
var concat = require('gulp-concat');
var ngAnnotate = require('gulp-ng-annotate');
var uglify = require('gulp-uglify');
var templateCache = require('gulp-angular-templatecache');
var concatCss = require('gulp-concat-css');
var minifyCss = require('gulp-minify-css');
gulp.task("cleanOutdatedLibraries", function(){
del("./Libs/*");
del(['./myapp.js', './myapp.min.js', './myapp.css'])
});
gulp.task("cleanTemporaryFiles", function(){
del("./output/*");
});
/** Run gulp clean on prebuild */
gulp.task('clean', ["cleanOutdatedLibraries", "cleanTemporaryFiles"])
gulp.task('copyNewestLibraries', function(){
var bowerFiles = ['angular/angular.min.js',
'angular/angular.js',
'angular/angular.min.js.map',
'angular-ui-router/release/angular-ui-router.min.js',
'angular-local-storage/dist/angular-local-storage.min.js',
'jquery/dist/jquery.min.js',
'jquery/dist/jquery.min.map',
'lodash/lodash.min.js',
'angular-resource/angular-resource.min.js',
'angular-resource/angular-resource.min.js.map',
'momentjs/min/moment.min.js',
'angular-loading-bar/src/loading-bar.js',
'ngDialog/js/ngDialog.min.js'];
gulp.src(bowerFiles, {cwd: "./bower_components/"})
.pipe(gulp.dest('./Libs'));
});
gulp.task('copyThirdPartyLibraries', function(){
var thirdPartyFiles = ['jquery-ui.min.js',
'angular-sanitize.min.js'];
gulp.src(thirdPartyFiles, {cwd: "./_thirdparty/"})
.pipe(gulp.dest('./Libs'));
});
/** Merge all Angular JS HTML templates into a cache */
gulp.task('mergeHtmlTemplatesIntoAngularCache', function(){
gulp.src('app/**/*.html')
.pipe(templateCache("templates.js", {
module: "myapp"
}))
.pipe(gulp.dest('./output/'));
});
gulp.task('produceMinfiedApp', function(){
gulp.src(['app/**/*.js', 'output/typescripts.js'])
.pipe(concat('bundle.min.js'))
.pipe(ngAnnotate())
.pipe(uglify())
.pipe(gulp.dest('./output/'));
gulp.src(['output/bundle.min.js', 'output/templates.js'])
.pipe(concat('myapp.min.js'))
.pipe(gulp.dest('./'));
});
gulp.task('produceApp', function(){
gulp.src(['app/**/*.js', 'output/typescripts.js'])
.pipe(concat('bundle.js'))
.pipe(ngAnnotate())
.pipe(gulp.dest('./output/'));
gulp.src(['output/bundle.js', 'output/templates.js'])
.pipe(concat('myapp.js'))
.pipe(gulp.dest('./'));
});
gulp.task('mergeStyles', function(){
gulp.src(['Styles/**/*.css'])
.pipe(concat('styles.css'))
.pipe(gulp.dest("./output/"));
gulp.src(['app/**/*.css'])
.pipe(concat('app.css'))
.pipe(gulp.dest("./output/"));
gulp.src(['output/styles.css', 'output/app.css'])
.pipe(concatCss("./myapp.css"))
.pipe(minifyCss({compatibility: 'ie10'}))
.pipe(gulp.dest('./'));
});
/** Run gulp build on post build */
gulp.task('build', ["copyNewestLibraries",
"copyThirdPartyLibraries",
"mergeHtmlTemplatesIntoAngularCache",
"produceMinfiedApp",
"produceApp",
"mergeStyles"]);
/** Run gulp build on post build */
gulp.task('build', ["copyNewestLibraries",
"copyThirdPartyLibraries",
"mergeHtmlTemplatesIntoAngularCache",
"produceMinfiedApp",
"produceApp",
"mergeStyles"]);
These tasks (copyNewestLibraries, produceApp, etc.) run asynchronously, in no particular order. E.g. produceApp may finish before copyNewestLibraries, which is probably not what you want.
See How to run Gulp tasks sequentially one after the other for more info.
I have an app using Grunt, that I launch in my terminal, and I want to run a task through an another app.
So I'd like to know how can I include my Gruntfile.js to this other app, and run the task.
For now this new app is really basic, juste a simple local web page using NodeJS, with a button that launch the task.
Gruntfile (I want to run the "archive" task)
module.exports = function (grunt) {
require('time-grunt')(grunt);
require('jit-grunt')(grunt, {
ngtemplates: "grunt-angular-templates"
});
var Generator = require("./generator.js")(grunt);
var generator = new Generator();
generator.printLogo();
// Build
grunt.registerTask("build", function (fileType) {
//definition of build task
grunt.task.run(tasks);
});
// Archive Task.
grunt.registerTask("archive", ["build", "compress", "clean:post-rsync"]);
};
Other file : (I tried a require, It seems to work, but I can't run the "archive" task of the Gruntfile.)
var grunt = require('grunt');
var gruntfile = require('./Gruntfile.js')(grunt);
var app = express();
app.get('/', function(req, res){
res.render('test.ejs');
});
app.post('/create', function(req, res){
//run grunt task "archive" here
//gruntfile.grunt.registerTask("archive", ["build"]);
res.redirect('/');
});
app.listen(8080);
Do you have any idea how could I run the task in my gruntfile in this other file ?
(The function printLogo() is working so i'm sure the Gruntfile is include)
Thank you very much (I'm a beginner with Grunt so sorry if I miss something trivial)
You can just run a command from node. This way you don’t have to worry about dependencies and what not. You just spawn grunt, like you normally would, except programatically.
var spawn = require('child_process').spawn;
// This will run the 'archive' task of grunt
spawn('grunt', ['archive'], {
cwd: 'path/to/grunt/project'
});
Grunt is a command line tool, the cleanest approach here would be to refactor your Gruntfile and extract your task's logics into a library.
Then from your Gruntfile's task you can call that library, and from your /create route you can also call your library.
You can use grunt-hub plugin:
grunt.initConfig({
hub: {
all: {
src: ['../*/Gruntfile.js'],
tasks: ['jshint', 'nodeunit'],
},
},
});