Gulp event.js:163 throw err; // Unhandled 'error' event - gulp

I have taken git clone and run npm install without sudo, the same setup was working perfect on windows machine but its breaking on Mac OSX:
Here is my gulpfile.js
var gulp = require('gulp');
// Load plugins
var plugin = require('gulp-load-plugins')({
pattern: '*'
});
var paths = {
css: 'app/resources/css',
sass: 'app/resources/scss',
js: 'app/**/*.module.js, app/components/**/*.js',
html: 'app/*.html'
};
// Compile SASS using Compass,
// Compass required as we using its utitlities
gulp.task('compass', function(){
return gulp.src( paths.sass + '/*.scss' )
.pipe(plugin.compass({
css: paths.css,
sass: paths.sass,
task: 'watch',
comments: false
}));
});
// Watch task, keep checking for changes
gulp.task('watch', function(){
gulp.watch([
paths.sass + '/*.scss',
paths.html,
paths.js
]).on('change', plugin.browserSync.reload);
});
// LiveReload Task
gulp.task('serve', function(){
plugin.browserSync.init([], {
server: {
baseDir: ['./', './app']
}
});
});
// Build HTML
gulp.task('html', function(){
return gulp.src('app/*.html')
.pipe(plugin.useref())
.pipe(gulp.dest('dist'));
});
// Copy Images
gulp.task('images', function(){
return gulp.src('app/resources/images/*')
.pipe(gulp.dest('dist/resources/images/'));
});
// Copy Fonts
gulp.task('fonts', function(){
return gulp.src('app/resources/fonts/*')
.pipe(gulp.dest('dist/resources/fonts/'));
});
// Copy Templates
gulp.task('templates', function(){
return gulp.src('app/components/**/*')
.pipe(gulp.dest('dist/components/'));
});
// Clean
gulp.task('clean', function(){
return gulp.src([
'dist/base', 'dist/components', 'dist/resources'
], {
read: false
})
.pipe( plugin.clean());
});
// Build
gulp.task('build', [ 'compass', 'html', 'images', 'fonts', 'templates', 'serve'])
// Default
gulp.task('default', ['clean'], function(){
gulp.start('build');
});
I am getting following error on terminal, thinks path is picking wrong dont know where i made mistake:
events.js:163
throw er; // Unhandled 'error' event
^
Error: Error: File not found with singular glob: /learning/recharge-desktop-code/learning/recharge-desktop-code/app/resources/css/common.css
at DestroyableTransform.<anonymous> (/learning/recharge-desktop-code/node_modules/gulp-useref/index.js:65:28)
at emitOne (events.js:101:20)
at DestroyableTransform.emit (events.js:191:7)
at emitOne (events.js:101:20)
at Through2.emit (events.js:191:7)
at OrderedStreams.<anonymous> (/learning/recharge-desktop-code/node_modules/gulp-useref/node_modules/glob-stream/index.js:140:20)
at emitOne (events.js:96:13)
at OrderedStreams.emit (events.js:191:7)
at emitOne (events.js:96:13)
at DestroyableTransform.emit (events.js:191:7)

Strange, it was path issue i have changed css path in my html and its worked, while same was not required on windows machine, is anyone can help to understand this?

Maybe is this problem.
It's say
Thanks! We are aware of this issue and a fix is being worked on. Closing as this is a duplicate of #12841. Be on the lookout for the next v7.x release (which will probably be next week). Thanks!
https://github.com/nodejs/node/issues/13077

Related

Trying to start server with Gulp and it throw error

I'm trying to run sever and I get this assertion error. I've uninstalled node and NPM and reinstalled again also I tried many steps and suggested solutions here but it doesn't fit with my problem.
AssertionError [ERR_ASSERTION]: Task never defined: node_modules/scss/bootstrap.scss
at getFunction (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\undertaker\lib\helpers\normalizeArgs.js:15:5)
at map (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\arr-map\index.js:20:14)
at normalizeArgs (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\undertaker\lib\helpers\normalizeArgs.js:22:10)
at Gulp.series (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\undertaker\lib\series.js:13:14)
at C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\gulpfile.js:7:26
at sass (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\undertaker\lib\set-task.js:13:15)
at bound (domain.js:422:14)
at runBound (domain.js:435:12)
at asyncRunner (C:\Users\Saviour\Desktop\Portfolio\Bootstrap\Project1\node_modules\async-done\index.js:55:18)
at processTicksAndRejections (internal/process/task_queues.js:75:11)
This's my code
var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var sass = require('gulp-sass');
gulp.task('sass', async function () {
return gulp.src(gulp.series('node_modules/scss/bootstrap.scss', 'src/scss/*.scss'))
.pipe(sass())
.pipe(gulp.dest("src/css"))
.pipe(browserSync.stream());
});
gulp.task('js', async function () {
return gulp.src(gulp.series('node_modules/bootstrap/dist/js/bootstrap.min.js', 'node_modules/jquery/dist/jquery.min.js', 'node_modules/popper.js/dist/popper.min.js'))
.pipe(gulp.dest('src/js'))
.pipe(browserSync.stream());
});
gulp.task('serve', async function () {
browserSync.init({
server: "./src",
});
gulp.watch(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'], 'sass');
gulp.watch("src/*.html").on('change', browserSync.reload);
})
gulp.task('default', gulp.series(gulp.parallel('sass', 'js', 'serve')));
The error is coming from the sass and js tasks. You are wrapping your sources in gulp.series. So Gulp is trying to run your sources as tasks.
They just need to be in an array [] like in the watch task.
Just change:
gulp.task('sass', async function () {
return gulp.src(gulp.series('node_modules/scss/bootstrap.scss', 'src/scss/*.scss'))
to:
gulp.task('sass', async function () {
return gulp.src(['node_modules/scss/bootstrap.scss', 'src/scss/*.scss'])
and then the same format in the js task
The second error (coming from your watch task) is because you need to wrap the tasks you are watching in either series or parallel. Even when theres only one task So change:
gulp.watch(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'], 'sass');
to:
gulp.watch(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'], gulp.series('sass'));

Gulp Scripts Throw Error: throw new errors.AssertionError

Assertion Error using Gulp:
$ gulp scripts
assert.js:42
throw new errors.AssertionError({
^
AssertionError [ERR_ASSERTION]: Task function must be specified
at Gulp.set [as _setTask] (/Users/ThedWord/Documents/my-project/node_modules/undertaker/lib/set-task.js:10:3)
at Gulp.task (/Users/ThedWord/Documents/my-proje
ct/node_modules/undertaker/lib/task.js:13:8)
at Object.<anonymous> (/Users/ThedWord/Documents/my-project/gulpfile.js:10:6)
at Module._compile (module.js:660:30)
at Object.Module._extensions..js (module.js:671:
at Module.load (module.js:573:32)
at tryModuleLoad (module.js:513:12)
at Function.Module._load (module.js:505:3)
at Module.require (module.js:604:17)
at require (internal/module.js:11:18)
/*eslint-env node */
const gulp = require('gulp');
const sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync').create();
const eslint = require('gulp-eslint');
const jasmine = require('gulp-jasmine-phantom');
const concat = require('gulp-concat');
gulp.task('default', ['copy-html', 'copy-images', 'styles', 'lint'], function() {
gulp.watch('sass/**/*.scss', ['styles']);
gulp.watch('js/**/*.js', ['lint']);
gulp.watch('/index.html', ['copy-html']);
gulp.watch('./build/index.html').on('change', browserSync.reload);
});
browserSync.init({
server: './dist'
});
gulp.task('scripts', function(){
gulp.src('js/**/*.js')
.pipe(concat('all.js'))
.pipe(gulp.dest('dist/js'));
});
gulp.task('scripts-dist', function(){
gulp.src('js/**/*.js')
.pipe(concat('all.js'))
.pipe(gulp.dest('dist/js'));
});
gulp.task('copy-html', function() {
gulp.src('./index.html')
.pipe(gulp.dest('./dist'));
});
gulp.task('copy-images', function(){
gulp.src('img/*')
.pipe(gulp.dest('dist/img'));
});
gulp.task('styles', function() {
gulp.src('sass/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(autoprefixer({
browsers: ['last 2 versions']
}))
.pipe(gulp.dest('dist/css'))
.pipe(browserSync.stream());
});
gulp.task('lint', function () {
return gulp.src(['js/**/*.js'])
// eslint() attaches the lint output to the eslint property
// of the file object so it can be used by other modules.
.pipe(eslint())
// eslint.format() outputs the lint results to the console.
// Alternatively use eslint.formatEach() (see Docs).
.pipe(eslint.format())
// To have the process exit with an error code (1) on
// lint error, return the stream and pipe to failOnError last.
.pipe(eslint.failOnError());
});
gulp.task('dist', [
'copy-html',
'copy-images',
'styles',
'lint',
'scripts-dist'
]);
gulp.task('tests', function () {
gulp.src('tests/spec/extraSpec.js')
.pipe(jasmine({
integration: true,
vendor: 'js/**/*.js'
}));
});
The problem you are encountering is that you are running gulp v4.0 using gulp 3 syntax. The AssertionError: Task function must be specified error comes from the fact that gulp.task has changed and the 3 parameters signature was removed. In short, your task below will need to be changed to remove the [] parameter:
gulp.task('default', ['copy-html', 'copy-images', 'styles', 'lint'], function() {
gulp.watch('sass/**/*.scss', ['styles']);
gulp.watch('js/**/*.js', ['lint']);
gulp.watch('/index.html', ['copy-html']);
gulp.watch('./build/index.html').on('change', browserSync.reload);
});
This article will help you migrate to gulp 4 syntax.
If you'd like a simple fix to your problem, without having to make changes to your gulpfile.js, run the following command to downgrade your version of gulp from version 4 to 3.9.1:
npm install gulp#3.9.1 --save
Assuming all goes well you should no longer see the Assertion error.

Gulp browsersync pipe not working

I'm trying to get browsersync (with stream) working, but it doesn't seem to work in pipe context. The sass compiles correctly, then nothing happens. My code is as follows:
gulp.task('sass', function () {
gulp.src('../css/source/*.scss')
.on('error', function (err) {
notify.onError({
title: "Gulp",
subtitle: "Failure!",
message: "<%= error.message %>",
sound: "Beep"
})(err);
this.emit('end');
})
.pipe(sourcemaps.init())
.pipe(sass())
.pipe(sourcemaps.write())
.pipe(concat('build.css'))
.pipe(gulp.dest('../css/build/dev'))
.pipe(browserSync.reload({stream:true}))
.pipe(csso())
.pipe(gulp.dest('../css/build/min'));
});
gulp.task('default', ['browser-sync'], function(){
gulp.watch('../css/source/*.scss', ['sass']);
});
In my terminal it does seem to register it though:
[BS] 1 file changed (build.css)
[BS] File changed: ../css/build/dev/build.css
The only way I can get a reload to happen is to add it to the watch task:
gulp.watch("../css/build/dev/*.css", browserSync.reload);
... but with this method I can't seem to enable the stream, as it doesn't accept a function. I have also tried browserSync.stream() as per the current docs to no avail.
Here is the browsersync task if it helps:
gulp.task('browser-sync', ['sass'], function() {
browserSync.init({
proxy: 'local.test.com',
host: '10.0.1.40'
});
});
Please help!
Remove the pipe to browserSync in task sass, and add a files key to browserSync.init():
browserSync.init({
...
files: ['../css/**/*.css'],
...
});
With the above setup you need neither gulp.watch() (that's for starting tasks based on file changes) nor a gulp task that depends on browserSync. Simply run gulp browser-sync.
Note that this watches the CSS directly to avoid a race condition between the scss changes and browserSync.

Gulp: Object #<Readable> has no method 'write' Error

I'm getting this error when trying to run my gulp command. It worked fine last week. Any reason why I'm getting the following error now?
TypeError: Object #<Readable> has no method 'write'
This is what the JS task looks like.
// JS task
gulp.task('js', function () {
var browserified = transform(function(filename) {
var b = browserify(filename);
return b.bundle();
});
return gulp.src('./src/js/*.js')
.pipe(browserified)
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./Build/js'))
.pipe(reload({stream: true}))
});
Here's a link to the entire gulpfile.js: https://github.com/realph/gulp-zero/blob/master/gulpfile.js
Any help is appreciated. Thanks in advance!
What version of browserify do you have at the moment? Browserify changed recently to not accept inward streams, just creating some. This would be the correct, adapted code:
var source = require('vinyl-source-stream');
var buffer = require('gulp-buffer');
gulp.task('js', function () {
return browserify({entries:['./src/js/main.js']})
.bundle()
.pipe(source('bundle.js'))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./Build/js'))
.pipe(reload({stream: true}))
});
Update I changed the filename to a real file. Note that browserify works best if you just have one file there. If you have to create multiple bundles, please refer to this article

Uglify throws Parse error

When i use gulp-uglify with browserify i get a error
events.js:72
throw er; // Unhandled 'error' event
^
Error
at new JS_Parse_Error (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:189:18)
at js_error (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:197:11)
at croak (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:656:9)
at token_error (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:664:9)
at expect_token (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:677:9)
at expect (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:680:36)
at /home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1222:13
at /home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:703:24
at expr_atom (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1152:35)
at maybe_unary (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1327:19)
at expr_ops (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1362:24)
at maybe_conditional (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1367:20)
at maybe_assign (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1391:20)
at expression (/home/rkmax/my-project/node_modules/gulp-uglify/node_modules/uglify-js/lib/parse.js:1410:20)
this is my scripts task
gulp.task('scripts', function() {
var bundler = browserify({
entries: ['./src/scripts/main.js'],
debug: debug
}).transform(stringify()); // the error persist even without this transformation
bundler
.bundle()
.on('error', handleErrors)
.pipe(source(getBundleName() + '.js'))
.pipe(jshint())
.pipe(jshint.reporter('default', { verbose: true }))
.pipe(jshint.reporter('fail'))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./web/js'));
});
uglify will parse the script content before minifying it. I suspect that one of the browserify source maps are being included in the stream down to uglify. Anyway to find the problem you can use gulp-util's log method to handle uglify's exceptions. Example:
...
var gulpUtil = require('gulp-util');
gulp.task('scripts', function() {
...
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify().on('error', gulpUtil.log)) // notice the error event here
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./web/js'));
});
If you still have problems fixing the issue, post the details after incorporating the error log.
I encountered this same issue with gulp-concat-sourcemap and gulp-uglify. I solved it by ignoring map files with gulp-ignore:
gulp.task("uglify-src", function() {
gulp.src([ "src/js/**/*.js" ])
.pipe(concat("app.js"))
.pipe(ignore.exclude([ "**/*.map" ]))
.pipe(uglify())
.pipe(gulp.dest("dist/js"));
});
It could be a simple error in your source JavaScript file. Try disabling uglify by commenting it out in your gulpfile and see if your browser console spots the real issue.
gulp.task('minified', function () {
return gulp.src(paths.concatScripts)
.pipe(sourcemaps.init())
//.pipe(uglify())
.pipe(sourcemaps.write('.', { addComment: false }))
.pipe(gulp.dest(publishUrl));
});
Errors are not propagated by Node.js pipe. This article mentions #Marcos Abreu's uglify().on approach in addition to describing the use of pump instead of pipe.
https://github.com/terinjokes/gulp-uglify/blob/master/docs/why-use-pump/README.md#why-use-pump