I'm using gulp uglify, and I'm getting an error.
this is my code:
var uglify = require('gulp-uglify');
var deleteLines = require('gulp-delete-lines');
// JS concat, strip debugging and minify
gulp.task('scripts', function() {
gulp.src(['./layout3/**/*.js','!./layout3/**/*.min.js'])
.pipe(deleteLines({
'filters': [/<script\s+type=["']text\/javascript["']\s+src=/i, /<script>/i]
}))
.pipe(uglify().on('error', function(e){
console.log(e);
}))
.pipe(gulp.dest('./layout2'));
});
I add print screen of the error:
I know that there is a problem in jquery.elevatezoom file, I can't find the problem.
thanks.
i got this error after update the 'gulp-uglify', in my case is the pipe was replaced by pump.
because the pump can show error detail, checkt this why use pump
so, maybe you can try this:
var pump = require('pump'); //npm install it first
gulp.task('cssmin', function (cb) {
pump([
gulp.src(['./layout3/**/*.js','!./layout3/**/*.min.js']),
deleteLines({'filters': [/<script\s+type=["']text\/javascript["']\s+src=/i, /<script>/i]}),
uglify().on('error', function(e){
console.log(e);
})
gulp.dest('./layout2')
],
cb
);});
it works on my project now, hope it can help.
I'm trying to utilize Browserify in my Gulp file, but it seems no matter how I set things up, it always throws an error that reads "dest.write is not a function". I originally started with this task using gulp-concat:
gulp.task('scripts', function()
{
return gulp.src(['src/shared/js/one.js', 'src/shared/js/two.js', 'src/shared/js/*.js'])
.pipe(browserify()
.pipe(concat('main.js'))
.pipe(gulp.dest('dist/js'))
.pipe(browserSync.stream());
});
When I commented out the browserify() line, everything worked fine. While Googling around for a solution to the error message, I found this page when someone linked to it, saying "the gulp docs rave about this solution" (here):
var gulp = require('gulp');
var browserify = require('browserify');
var transform = require('vinyl-transform');
var uglify = require('gulp-uglify');
gulp.task('browserify', function () {
var browserified = transform(function(filename) {
var b = browserify(filename);
return b.bundle();
});
return gulp.src(['./src/*.js'])
.pipe(browserified)
.pipe(uglify())
.pipe(gulp.dest('./dist'));
});
I dug further, and read that vinyl-transform doesn't work with Browserify in this way because there is no write stream, and the preferred method was to use vinyl-source-stream instead. I'm now currently trying to use this proposed solution, but still getting the error:
gulp.task('scripts', function()
{
return gulp.src(['src/shared/js/one.js', 'src/shared/js/two.js', 'src/shared/js/*.js'])
.pipe(browserify('src/shared/js/*.js', {
debug: true,
extensions: ['.js']
}))
.bundle()
.pipe(source('main.js'))
.pipe(buffer())
.pipe(gulp.dest('dist/js'))
.pipe(browserSync.stream());
});
Tweaking the browserify() reference in various ways has not changed anything. Can anyone tell me what I'm doing wrong?
Here's the solution that worked for me in exactly same situation.
I spent some time trying to make vinyl-transform work with browserify, without success, so had to revert to vinyl-source-stream and vinyl-buffer combination.
I used the following gist as a base reference for my code snippet:
https://gist.github.com/stoikerty/cfa49330a9609f6f8d2d
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var uglify = require('gulp-uglify');
gulp.task('browserify', function () {
var b = browserify({
entries: './js/test.js', // Only need initial file, browserify finds the deps
debug: true // Enable sourcemaps
});
return b.bundle()
.pipe(source('./js/test.js')) // destination file for browserify, relative to gulp.dest
.pipe(buffer())
.pipe(uglify())
.pipe(gulp.dest('./dist'));
});
I am wondering how I can run a protractor test as a script and not as a child process or from a task runner such as grunt and gulp. I am wanting to run the test suits in order when my sauce queuing application notifies the test runner I am building. This way, my tests do not conflict with my co-workers tests.
I am using node, so is there something like this?
var protractor = require('protractor');
protractor.run('path/to/conf', suites, callback);
protractor.on('message', callback)
protractor.on('error', callback)
protractor.end(callback);
It will not be possible. I tried to do that but by reading the protractor source code there is no way to perform this.
https://github.com/angular/protractor/blob/master/lib/launcher.js#L107
This function is called with your config as a json object, but as you can see it calls a bunch of process.exit, according to this it will not be possible to run this without at least forking your process.
My solution for programmatically call protractor is the following:
var npm = require('npm');
var childProcess = require('child_process');
var address = ...some address object
var args = ['--baseUrl', url.format(address)];
npm.load({}, function() {
var child = childProcess
.fork(path.join(npm.root, 'protractor/lib/cli'), args)
.on('close', function(errorCode) {
console.log('error code: ', errorCode);
});
process.on('SIGINT', child.kill);
});
const Launcher = require("protractor/built/launcher");
Launcher.init('path/to/conf');
const protractorFlake = require('protractor-flake'),
baseUrl = process.argv[2],
maxAttempts = process.argv[3];
if (process.argv.length > 2) {
console.info('Launching protractor with baseUrl: %s, maxAttempts: %d', baseUrl, maxAttempts);
protractorFlake({
maxAttempts: maxAttempts,
parser: 'multi',
protractorArgs: [
'./protractor.conf.js',
'--baseUrl',
baseUrl
]
}, function (status, output) {
process.exit(status);
});
} else {
console.error(`
Usage: protractor-wrapper <baseUrl>
`);
}
I'm running gulp 3.6.2 and have the following task that was set up from a sample online
gulp.task('watch', ['default'], function () {
gulp.watch([
'views/**/*.html',
'public/**/*.js',
'public/**/*.css'
], function (event) {
return gulp.src(event.path)
.pipe(refresh(lrserver));
});
gulp.watch(['./app/**/*.coffee'],['scripts']);
gulp.watch('./app/**/*.scss',['scss']);
});
Any time there's an error in my CoffeeScript gulp watch stops - obviously not what I want.
As recommended elsewhere I tried this
gulp.watch(['./app/**/*.coffee'],['scripts']).on('error', swallowError);
gulp.watch('./app/**/*.scss',['scss']).on('error', swallowError);
function swallowError (error) { error.end(); }
but it doesn't seem to work.
What am I doing wrong?
In response to #Aperçu's answer I modified my swallowError method and tried the following instead:
gulp.task('scripts', function () {
gulp.src('./app/script/*.coffee')
.pipe(coffee({ bare: true }))
.pipe(gulp.dest('./public/js'))
.on('error', swallowError);
});
Restarted, and then created a syntax error in my coffee file. Same issue:
[gulp] Finished 'scripts' after 306 μs
stream.js:94
throw er; // Unhandled stream error in pipe.
^
Error: W:\bariokart\app\script\trishell.coffee:5:1: error: unexpected *
*
^
at Stream.modifyFile (W:\bariokart\node_modules\gulp-coffee\index.js:37:33)
at Stream.stream.write (W:\bariokart\node_modules\gulp-coffee\node_modules\event-stream\node_modules\through\index.js:26:11)
at Stream.ondata (stream.js:51:26)
at Stream.EventEmitter.emit (events.js:95:17)
at queueData (W:\bariokart\node_modules\gulp\node_modules\vinyl-fs\node_modules\map-stream\index.js:43:21)
at next (W:\bariokart\node_modules\gulp\node_modules\vinyl-fs\node_modules\map-stream\index.js:71:7)
at W:\bariokart\node_modules\gulp\node_modules\vinyl-fs\node_modules\map-stream\index.js:85:7
at W:\bariokart\node_modules\gulp\node_modules\vinyl-fs\lib\src\bufferFile.js:8:5
at fs.js:266:14
at W:\bariokart\node_modules\gulp\node_modules\vinyl-fs\node_modules\graceful-fs\graceful-fs.js:104:5
at Object.oncomplete (fs.js:107:15)
Your swallowError function should look like this:
function swallowError (error) {
// If you want details of the error in the console
console.log(error.toString())
this.emit('end')
}
I think you have to bind this function on the error event of the task that was falling, not the watch task, because that's not where comes the problem, you should set this error callback on each task that may fail, like plugins that breaks when you have missed a ; or something else, to prevent watch task to stop.
Examples :
gulp.task('all', function () {
gulp.src('./app/script/*.coffee')
.pipe(coffee({ bare: true }))
.on('error', swallowError)
.pipe(gulp.dest('./public/js'))
gulp.src('css/*.scss')
.pipe(sass({ compass: true }))
.on('error', swallowError)
.pipe(cssmin())
.pipe(gulp.dest('dist'))
})
Alternately, if you don't mind to include another module, you can use the log function of gulp-util to keep you from declare an extra function in your gulpfile:
.on('error', gutil.log)
But I may recommend having a look at the awesome gulp-plumber plugin, which is used to remove the onerror handler of the error event, causing the break of the streams. It's very simple to use and it stops you from catch all the tasks that may fail.
gulp.src('./app/script/*.coffee')
.pipe(plumber())
.pipe(coffee({ bare: true }))
.pipe(gulp.dest('./public/js'))
More info about this on this article by the creator of the concerned plugin.
The above examples didn't work for me. The following did though:
var plumber = require('gulp-plumber');
var liveReload = require('gulp-livereload');
var gutil = require('gulp-util');
var plumber = require('gulp-plumber');
var compass = require('gulp-compass');
var rename = require('gulp-rename');
var minifycss = require('gulp-minify-css');
var notify = require('gulp-notify');
gulp.task('styles', function () {
//only process main.scss which imports all other required styles - including vendor files.
return gulp.src('./assets/scss/main.scss')
.pipe(plumber(function (error) {
gutil.log(error.message);
this.emit('end');
}))
.pipe(compass({
config_file: './config.rb',
css: './css'
, sass: './assets/scss'
}))
//minify files
.pipe(rename({suffix: '.min'}))
.pipe(minifycss())
//output
.pipe(gulp.dest('./css'))
.pipe(notify({message: 'Styles task complete'}));
});
gulp.task('watch', function () {
liveReload.listen();
gulp.watch('assets/scss/**/*.scss', ['styles']);
});
With one format of files
(ex: *.coffee only)
If you want to work only with one format of files, then gulp-plumber is your solution.
For example rich handled errors and warning for coffeescripting:
gulp.task('scripts', function() {
return gulp.src(['assets/scripts/**/*.coffee'])
.pipe(plumber())
.pipe(coffeelint())
.pipe(coffeelint.reporter())
.pipe(lintThreshold(10, 0, lintThresholdHandler))
.pipe(coffee({
bare: true
}))
.on('error', swallowError)
.pipe(concat('application.js'))
.pipe(gulp.dest('dist/scripts'))
.pipe(rename({ suffix: '.min' }))
.pipe(uglify())
.pipe(gulp.dest('dist/scripts'))
.pipe(notify({ message: 'Scripts task complete' }));
});
With multiple types of file formats
(ex: *.coffee and *.js at same time)
But if you won't to work with multiple types of file formats (for example: *.js and *.coffee), than i will post my solution.
I will just post a self explanatory code over here, with some description before.
gulp.task('scripts', function() {
// plumber don't fetch errors inside gulpif(.., coffee(...)) while in watch process
return gulp.src(['assets/scripts/**/*.js', 'assets/scripts/**/*.coffee'])
.pipe(plumber())
.pipe(gulpif(/[.]coffee$/, coffeelint()))
.pipe(coffeelint.reporter())
.pipe(lintThreshold(10, 0, lintThresholdHandler))
.pipe(gulpif(/[.]coffee$/, coffee({ // if some error occurs on this step, plumber won't catch it
bare: true
})))
.on('error', swallowError)
.pipe(concat('application.js'))
.pipe(gulp.dest('dist/scripts'))
.pipe(rename({ suffix: '.min' }))
.pipe(uglify())
.pipe(gulp.dest('dist/scripts'))
.pipe(notify({ message: 'Scripts task complete' }));
});
I faced the issue with gulp-plumber and gulp-if using gulp.watch(...
See related issue here: https://github.com/floatdrop/gulp-plumber/issues/23
So the best option for me was:
Each part as file, and concatenate after. Create multiple tasks that can process each part in separate file (like grunt does), and concatenate them
Each part as stream, and merge streams after. Merge two streams using merge-stream (that was made from event-stream) into one and continue the job (i tried that first, and it work fine for me, so it is faster solution than previous one)
Each part as stream, and merge streams after
Her is the main part of my code:
gulp.task('scripts', function() {
coffeed = gulp.src(['assets/scripts/**/*.coffee'])
.pipe(plumber())
.pipe(coffeelint())
.pipe(coffeelint.reporter())
.pipe(lintThreshold(10, 0, lintThresholdHandler))
.pipe(coffee({
bare: true
}))
.on('error', swallowError);
jsfiles = gulp.src(['assets/scripts/**/*.js']);
return merge([jsfiles, coffeed])
.pipe(concat('application.js'))
.pipe(gulp.dest('dist/scripts'))
.pipe(rename({ suffix: '.min' }))
.pipe(uglify())
.pipe(gulp.dest('dist/scripts'))
.pipe(notify({ message: 'Scripts task complete' }));
});
Each part as file, and concatenate after
If to separate this into parts, then in each part there should be a result file created. For ex.:
gulp.task('scripts-coffee', function() {
return gulp.src(['assets/scripts/**/*.coffee'])
.pipe(plumber())
.pipe(coffeelint())
.pipe(coffeelint.reporter())
.pipe(lintThreshold(10, 0, lintThresholdHandler))
.pipe(coffee({
bare: true
}))
.on('error', swallowError)
.pipe(concat('application-coffee.js'))
.pipe(gulp.dest('dist/scripts'));
});
gulp.task('scripts-js', function() {
return gulp.src(['assets/scripts/**/*.js'])
.pipe(concat('application-coffee.js'))
.pipe(gulp.dest('dist/scripts'));
});
gulp.task('scripts', ['scripts-js', 'scripts-coffee'], function() {
var re = gulp.src([
'dist/scripts/application-js.js', 'dist/scripts/application-coffee.js'
])
.pipe(concat('application.js'))
.pipe(gulp.dest('dist/scripts'))
.pipe(rename({ suffix: '.min' }))
.pipe(uglify())
.pipe(gulp.dest('dist/scripts'))
.pipe(notify({ message: 'Scripts task complete' }));
del(['dist/scripts/application-js.js', 'dist/scripts/application-coffee.js']);
return re;
});
P.S.:
Here node modules and functions that were used:
// Load plugins
var gulp = require('gulp'),
uglify = require('gulp-uglify'),
rename = require('gulp-rename'),
concat = require('gulp-concat'),
notify = require('gulp-notify'),
plumber = require('gulp-plumber'),
merge = require('ordered-merge-stream'),
replace = require('gulp-replace'),
del = require('del'),
gulpif = require('gulp-if'),
gulputil = require('gulp-util'),
coffee = require('gulp-coffee'),
coffeelint = require('gulp-coffeelint),
lintThreshold = require('gulp-coffeelint-threshold');
var lintThresholdHandler = function(numberOfWarnings, numberOfErrors) {
var msg;
gulputil.beep();
msg = 'CoffeeLint failure; see above. Warning count: ';
msg += numberOfWarnings;
msg += '. Error count: ' + numberOfErrors + '.';
gulputil.log(msg);
};
var swallowError = function(err) {
gulputil.log(err.toString());
this.emit('end');
};
I like to use gulp plumber because it can add a global listener to a task and have a meaningful message displayed.
var plumber = require('gulp-plumber');
gulp.task('compile-scss', function () {
gulp.src('scss/main.scss')
.pipe(plumber())
.pipe(sass())
.pipe(autoprefixer())
.pipe(cssnano())
.pipe(gulp.dest('css/'));
});
Reference : https://scotch.io/tutorials/prevent-errors-from-crashing-gulp-watch
A simple solution to this is to put gulp watch in an infinite loop within a Bash (or sh) shell.
while true; do gulp; gulp watch; sleep 1; done
Keep the output of this command in a visible area on your screen as you edit your JavaScript. When your edits result in an error, Gulp will crash, print its stack trace, wait for a second, and resume watching your source files. You can then correct the syntax error, and Gulp will indicate whether or not the edit was a success by either printing out it's normal output, or crashing (then resuming) again.
This will work in a Linux or Mac terminal. If you are using Windows, use Cygwin or Ubuntu Bash (Windows 10).
I have implemented the following hack as a workaround for https://github.com/gulpjs/gulp/issues/71:
// Workaround for https://github.com/gulpjs/gulp/issues/71
var origSrc = gulp.src;
gulp.src = function () {
return fixPipe(origSrc.apply(this, arguments));
};
function fixPipe(stream) {
var origPipe = stream.pipe;
stream.pipe = function (dest) {
arguments[0] = dest.on('error', function (error) {
var state = dest._readableState,
pipesCount = state.pipesCount,
pipes = state.pipes;
if (pipesCount === 1) {
pipes.emit('error', error);
} else if (pipesCount > 1) {
pipes.forEach(function (pipe) {
pipe.emit('error', error);
});
} else if (dest.listeners('error').length === 1) {
throw error;
}
});
return fixPipe(origPipe.apply(this, arguments));
};
return stream;
}
Add it to your gulpfile.js and use it like that:
gulp.src(src)
// ...
.pipe(uglify({compress: {}}))
.pipe(gulp.dest('./dist'))
.on('error', function (error) {
console.error('' + error);
});
This feels like the most natural error handling to me. If there is no error handler at all, it will throw an error. Tested with Node v0.11.13.
Typescript
This is what worked for me. I work with Typescript and separated the function (to aovid confusion with this keyword) to handle less. This works with Javascript as well.
var gulp = require('gulp');
var less = require('gulp-less');
gulp.task('less', function() {
// writing a function to avoid confusion of 'this'
var l = less({});
l.on('error', function(err) {
// *****
// Handle the error as you like
// *****
l.emit('end');
});
return gulp
.src('path/to/.less')
.pipe(l)
.pipe(gulp.dest('path/to/css/output/dir'))
})
Now, when you watch .less files, and an error occurs, the watch will not stop and new changes will processed as per your less task.
NOTE : I tried with l.end();; however, it did not work. However, l.emit('end'); totally works.
Hope this help. Good Luck.
This worked for me ->
var gulp = require('gulp');
var sass = require('gulp-sass');
gulp.task('sass', function(){
setTimeout(function(){
return gulp.src('sass/*.sass')
.pipe(sass({indentedSyntax: true}))
.on('error', console.error.bind(console))
.pipe(gulp.dest('sass'));
}, 300);
});
gulp.task('watch', function(){
gulp.watch('sass/*.sass', ['sass']);
});
gulp.task('default', ['sass', 'watch'])
I just added the
.on('error', console.error.bind(console))
line, but I had to run the
gulp
command as root. I'm running node gulp on a php application so I have multiple accounts on one server, which is why I ran into the issue of gulp breaking on syntax errors because I was not running gulp as root... Maybe plumber and some of the other answers here would have worked for me if I ran as root.
Credit to Accio Code https://www.youtube.com/watch?v=iMR7hq4ABOw for the answer. He said that by handling the error it helps you to determine what line the error is on and what it is in the console, but also stops gulp from breaking on syntax error. He said it was kind of a light weight fix, so not sure if it will work for what you are looking for. Quick fix though, worth a shot. Hope this helps someone!
I'm building a logging module for my web app in nodejs. I'd like to be able to test using mocha that my module outputs the correct messages to the terminal. I have been looking around but haven't found any obvious solutions to check this. I have found
process.stdout.on('data', function (){})
but haven't been able to get this to work. does anybody have any advice?
process.stdout is never going to emit 'data' events because it's not a readable stream. You can read all about that in the node stream documentation, if you're curious.
As far as I know, the simplest way to hook or capture process.stdout or process.stderr is to replace process.stdout.write with a function that does what you want. Super hacky, I know, but in a testing scenario you can use before and after hooks to make sure it gets unhooked, so it's more or less harmless. Since it writes to the underlying stream anyway, it's not the end of the world if you don't unhook it anyway.
function captureStream(stream){
var oldWrite = stream.write;
var buf = '';
stream.write = function(chunk, encoding, callback){
buf += chunk.toString(); // chunk is a String or Buffer
oldWrite.apply(stream, arguments);
}
return {
unhook: function unhook(){
stream.write = oldWrite;
},
captured: function(){
return buf;
}
};
}
You can use it in mocha tests like this:
describe('console.log', function(){
var hook;
beforeEach(function(){
hook = captureStream(process.stdout);
});
afterEach(function(){
hook.unhook();
});
it('prints the argument', function(){
console.log('hi');
assert.equal(hook.captured(),'hi\n');
});
});
Here's a caveat: mocha reporters print to the standard output. They do not, as far as I know, do so while example (it('...',function(){})) functions are running, but you may run into trouble if your example functions are asynchronous. I'll see if I can find more out about this.
I've attempted jjm's answer and had problems which I suspect was due to my programs async behaviour.
I found a solution via a cli on github that uses the sinon library.
An example code to test:
/* jshint node:true */
module.exports = Test1;
function Test1(options) {
options = options || {};
}
Test1.prototype.executeSync = function() {
console.log("ABC");
console.log("123");
console.log("CBA");
console.log("321");
};
Test1.prototype.executeASync = function(time, callback) {
setTimeout(function() {
console.log("ABC");
console.log("123");
console.log("CBA");
console.log("321");
callback();
}, time);
};
And the mocha tests:
/* jshint node:true */
/* global describe:true, it:true, beforeEach:true, afterEach:true, expect:true */
var assert = require('chai').assert;
var expect = require('chai').expect;
var sinon = require("sinon");
var Test1 = require("../test");
var test1 = null;
describe("test1", function() {
beforeEach(function() {
sinon.stub(console, "log").returns(void 0);
sinon.stub(console, "error").returns(void 0);
test1 = new Test1();
});
afterEach(function() {
console.log.restore();
console.error.restore();
});
describe("executeSync", function() {
it("should output correctly", function() {
test1.executeSync();
assert.isTrue(console.log.called, "log should have been called.");
assert.equal(console.log.callCount, 4);
assert.isFalse(console.log.calledOnce);
expect(console.log.getCall(0).args[0]).to.equal("ABC");
expect(console.log.getCall(1).args[0]).to.equal("123");
expect(console.log.args[2][0]).to.equal("CBA");
expect(console.log.args[3][0]).to.equal("321");
});
});
describe("executeASync", function() {
it("should output correctly", function(done) {
test1.executeASync(100, function() {
assert.isTrue(console.log.called, "log should have been called.");
assert.equal(console.log.callCount, 4);
assert.isFalse(console.log.calledOnce);
expect(console.log.getCall(0).args[0]).to.equal("ABC");
expect(console.log.getCall(1).args[0]).to.equal("123");
expect(console.log.args[2][0]).to.equal("CBA");
expect(console.log.args[3][0]).to.equal("321");
done();
});
});
});
});
I'm providing the above as it demonstrates working with async calls, it deals with both console and error output and the method of inspection is of more use.
I should note that I've provided two methods of obtaining what was passed to the console, console.log.getCall(0).args[0] and console.log.args[0][0]. The first param is the line written to the console. Feel free to use what you think is appropriate.
Two other libraries that help with this are test-console and intercept-stdout I haven't used intercept-stdout, but here's how you can do it with test-console.
var myAsync = require('my-async');
var stdout = require('test-console').stdout;
describe('myAsync', function() {
it('outputs something', function(done) {
var inspect = stdout.inspect();
myAsync().then(function() {
inspect.restore();
assert.ok(inspect.output.length > 0);
done();
});
});
});
Note: You must use Mocha's async api. No calling done() will swallow mocha's test messaging.