I cannot run the watchTask using Gulp - node.js

I'm setting up a development using node.js and gulp. which consists of functions like scssTask, jsTask, cacheBustTask, watchTask. and a default task.
This error occurs when running gulp in terminal:
ReferenceError: watch is not defined
https://www.screencast.com/t/ercavfT2gZb

You call watch in your watchTask but that is never defined because you didn't include it in the require statement.
const { src, dest, series, parallel } = require('gulp');
Add watch to that:
const { src, dest, series, parallel, watch } = require('gulp');

Related

Task never defined: default, To list available tasks, try running: gulp --tasks

When running the following code I receive the following error:
[23:00:29] Task never defined: default
[23:00:29] To list available tasks, try running: gulp --tasks
gulp -v
CLI version: 2.2.0
Local version: 4.0.1
Can you let me know what I'm doing wrong here?
const gulp = require('gulp');
const sass = require('gulp-sass');
const browserSync = require('browser-sync').create();
//compile scss into css
function style() {
//1. where is my sass file going to be
return gulp.src('./scss/**/*.sass')
//2. pass that file through sass compiler
.pipe(sass())
//3.Where do I save the compiled css
.pipe(gulp.dest('./css'))
}
exports.style = style;
Like the error says, you aren't defining a default task.
Either
run gulp style, or
export style as default (exports.default = style)

Stdout maxBuffer error while running Gulp 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!

Can I split my gulp tasks between different files when using Visual Studio?

I'm using Visual Studio 2015 and I have gulpfile that I run with the gulp task manager.
The file is getting bigger and bigger. Is there some way that I can split the tasks into more than one file. If there is then I would really appreciate a very small example of how I can do this.
Yes, as the gulp documentation explains: https://github.com/gulpjs/gulp/blob/master/docs/recipes/split-tasks-across-multiple-files.md
This is depreciated and will not be supported in gulp 4.0.
gulpfile.js
var requireDir = require('require-dir');
var tasks = requireDir('./tasks');
Or with gulp-require-tasks
gulpfile.js
// Require the module.
var gulpRequireTasks = require('gulp-require-tasks');
// Call it when neccesary.
gulpRequireTasks({
path: __dirname + '/tasks' // This is default
});
tasks/one.js
module.exports = {
dep: ['clean:styles'],
fn: function (gulp, callback) {
return gulp.src('...')
.pipe(plugin())
.dest('...');
}
};

How to package node webkit app

I'm developing my first node webkit app. I'm confused about packing the files. Is the end product a single file that can be executed ?
The end result will not be a single executable, you must also include some DLLs in your zip-file.
These line in github made me more confused.
How is the packaging done ?
Do I need to include the webkit files also in the package or just the files I have created ?
I packaged my node-webkit app successfully for various platforms by using the below gulp script. Below is the script which is self explanatory.
Reference : https://github.com/nwjs/nwbuilder/blob/master/example/Gulpfile.js
var NwBuilder = require('nw-builder');
var gulp = require('gulp');
var gutil = require('gulp-util');
gulp.task('nw', function () {
var nw = new NwBuilder({
version: '0.12.3',
files: '../nodepoc/**',
platforms: ['osx64','win32','win64']
});
// Log stuff you want
nw.on('log', function (msg) {
gutil.log('nw-builder', msg);
});
// Build returns a promise, return it so the task isn't called in parallel
return nw.build().catch(function (err) {
gutil.log('nw-builder', err);
});
});
gulp.task('default', ['nw']);
Save the file as gulpFile.js. In terminal , simply run gulp command in the same location as that of the gulpFile.js and it will download the necessary node-webkit distributions for the platforms and build the package for you.

Start gulp task from another node.js script

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()});

Resources