I am trying, to write a module that when gulp is watching a task, and a Less file changed with some error, it should give a message to the console, but it should not crash the system, which it does no:
This is the code I have written:
var onError = function (err) {
console.log(err);
};
gulp.task('styles', function () {
gulp.src('./{views}/**/*.{less}')
.pipe(plumber({
errorHandler: onError
}))
.pipe(less())
.pipe(gulp.dest('build/styles/common.css'));
});
When I run the above code, I get the error below:
'styles' errored after 20 ms
Error in plugin 'plumber'
Message:
Can't pipe to undefined
I have had the same error. I resolved it by adding () after the plumber. Here is the code.
Earlier Code:
gulp.task('scripts',function(){
gulp.src('admin-scripts.js')
.pipe(plumber)
.pipe(uglify().on('error', function(e){
console.log(e);
}))
.pipe(gulp.dest('build/js'));
});
Fixed Code:
gulp.task('scripts',function(){
gulp.src('admin-scripts.js')
.pipe(plumber())
.pipe(uglify().on('error', function(e){
console.log(e);
}))
.pipe(gulp.dest('build/js'));
});
I was missing the () after plumber.
Hope this helps.
Are you sure to have installed gulp-less using
npm install --save-dev
and referencing it in your gulpfile with
var less = require('gulp-less');
This error from plumber occurs when the destination of your pipe (here your less) is undefined.
Also why are you using the {} here ? They are a bit useless I think since you're targetting only one thing in it, you could remove them.
Yes I have installed gulp-less, and I figured out the solution for this problem aswell:
It should be as follow:
gulp.task('mystyle', function () {
gulp.src('build/stylesfiles.less').pipe(plumber()).pipe(less()).
pipe(gulp.dest ('build/styles/assets'));
});
Basically I do not need the Error message, it will give me a default error, which can get my job done.Using the above code will make sure it runs, and gives me my error, but not crash the server....but thank you "Apercu"
Related
When I run task for example using comman gulp scripts:common, I get this output:
[14:05:47] Requiring external module babel-core/register
[14:05:49] Using gulpfile /home/sites/blablabla/gulpfile.babel.js
[14:05:49] Starting 'scripts:common'...
events.js:141
throw er; // Unhandled 'error' event
^
SyntaxError: Unexpected token
Well, for SyntaxError it would be useful to know where it found that unexpected token. How to tell it to show at least file and line? Where to find that evetns.js file? Could I put console.trace() or something like that there?
I solve this problem by running jshint on my scripts:
/*
* `gulp check_scripts` - Lints script files
*/
gulp.task('check_scripts', function() {
return gulp.src([
'gulpfile.js' //, other scripts to check
])
.pipe(jshint())
.pipe(jshint.reporter('jshint-stylish'))
.pipe(gulpif(enabled.failJSHint, jshint.reporter('fail')));
});
enabled.failJSHint is there to allow errors to pass in local environment but fail in production.
This will lint any syntax errors in your scripts.
Additionally you may want to hook it to other task so it's run automatically before proper build:
gulp.task('default', ['check_scripts', 'clean'], function() {
gulp.start('build');
});
This is the general idea.
You can look at error stack trace by adding custom "on error" handler to the gulp task.
gulp.task('compile:js', function() {
return (
gulp.src(jsPath)
.pipe(yourCustomTask())
.on('error', function(err) {
console.log(err.stack);
this.end();
})
);
});
Also, as another variant, adding gulp-plumber into pipeline makes error messages more clear.
I've been refactoring an existing site towards using gulp and npm more efficiently. I'd like to incorporate inquirer into my tasks to define some build alternatives. For now I'm starting simple.
Here is my current gulpfile:
//Define our required components
var gulp = require('gulp');
var inq = require('inquirer');
var plugins = require('gulp-load-plugins')({ scope: ['dependencies', 'devDependencies'] });
//Function that retrieves the file for the specifically names task
function getTask(task) {
return require('./gulp-tasks/' + task)(gulp, plugins);
};
//Call for our tasks
gulp.task('thirdPartyComponents', getTask('ThirdPartyComponents'));
gulp.task('thirdPartyComponents.css', getTask('ThirdPartyComponentsCss'));
gulp.task('buyer.app', getTask('Buyer.App'));
gulp.task('buyer.controllers', getTask('Buyer.Controllers'));
gulp.task('buyer.directives', getTask('Buyer.Directives'));
gulp.task('buyer.filters', getTask('Buyer.Filters'));
//CODE NOTE: Dependent tasks are case-sensitive
gulp.task('default', function () {
var questions =
[
{
type: 'confirm',
name: 'minimize',
message: 'Do you want to minimize the files?',
default: true
}
];
inq.prompt(questions).then(function (answers) {
console.log(answers);
});
});
When I run the task I get this in the output window in the task explorer
[16:21:21] Using gulpfile ....
[16:21:21] Starting 'default'...
[16:21:21] 'default' errored after 185 ms
[16:21:21] Error: Implement me. Unknown stdin file type!
at process.stdin (node.js:740:17)
at setupReadlineOptions (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\inquirer\lib\ui\baseUI.js:57:35)
at module.exports (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\inquirer\lib\ui\baseUI.js:14:40)
at new module.exports (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\inquirer\lib\ui\prompt.js:15:8)
at Object.promptModule [as prompt] (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\inquirer\lib\inquirer.js:26:14)
at Gulp.<anonymous> (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\Gulpfile.js:31:9)
at module.exports (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\orchestrator\lib\runTask.js:34:7)
at Gulp.Orchestrator._runTask (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\orchestrator\index.js:273:3)
at Gulp.Orchestrator._runStep (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\orchestrator\index.js:214:10)
at Gulp.Orchestrator.start (C:\Projects\BuyerSupplier\BuyerSupplier\Main\Source\BuyerSupplier.site-dev\src\BuyerSupplier.site\node_modules\orchestrator\index.js:134:8)
Process terminated with code 1.
I'm not sure why something this straightforward doesnt want to fire off....any help is really appreciated.
Found the issue, and its nothing to do with the code directly. I am running inside Visual Studio and was using the Task Runner Explorer to call the default task. This was where I was seeing the issue.
After doing more research, and on a whim, I ran the gulp task from a command window. It completed as expected. Therefore there are still issues within the Task runner with commands that use process.stdin command.
Following is my gulpfile.js. There are a couple of more tasks in it and all are working fine - but the last task, watch doesn't.
I've tried every possible combination of paths and files and what so ever, but still I don't have luck. I've read many answers on this here, but couldn't solve my problem. I tried to run gulp.watch with and without requiring gulp-watch, tried several different approaches on how to set up the task and so on and so on...
var gulp = require('gulp');
var browserify = require('browserify');
var babelify = require('babelify');
var source = require('vinyl-source-stream');
var watch = require('gulp-watch');
gulp.task('application', function() {
return browserify('./public/resources/jsx/application.js')
.transform(babelify, { stage: 0 })
.bundle()
.on('error', function(e){
console.log(e.message);
this.emit('end');
})
.pipe(source('appBundle.js'))
.pipe(gulp.dest('./public/resources/jsx'));
});
gulp.task('watch', function() {
gulp.watch('./public/resources/jsx/project/*.js',['application'])
});
Can someone suggest a solution?
EDIT:
Here's the console output:
michael#michael-desktop:/opt/PhpstormProjects/app_april_2015$ gulp watch
[23:05:03] Using gulpfile /opt/PhpstormProjects/app_april_2015/gulpfile.js
[23:05:03] Starting 'watch'...
[23:05:03] Finished 'watch' after 13 ms
You should return watch:
gulp.task('watch', function() {
return gulp.watch('./public/resources/jsx/project/*.js',['application'])
});
watch is an async method, so the only way Gulp can know that something is happening is if you return a promise, which watch does.
Edit
As #JMM stated, watch doesn't return a Promise. It returns an EventEmitter.
I'm a little confused. In my little project I'm using Jasmine, Require.js, Phantomjs and Grunt (all these via Yeoman). So when run I grunt test in the terminal, I get the error:
>> ReferenceError: Can't find variable: define at
>> test/spec/testSpec.js:15
Warning: No specs executed, is there a configuration error? Use --force to continue.
Aborted due to warnings.
But when I perform the test in a browser, the test goes fine...
Here's my simple test spec:
define(['spec/test'], function(Test) {
describe('Test for unit-test', function() {
describe('Test namespace', function() {
it('should be defined', function() {
expect(Test).toBeDefined();
});
});
});
});
Module:
define([], function () {
var Test = {};
return Test;
});
Can someone help me solve this, please?
Many thanks
It seems Grunt doesn't load RequireJS. Maybe this could help you.
I'm writing a grunt task and I want to install a dependency programmatically. However, I can't seem to figure out how to use their API.
This works just fine, but parsing the response is brittle because it uses the CLI:
grunt.util.spawn({
cmd: 'bower',
args: ['install', '--save', 'git#github.com:foo/bar.git']
}, function(none, message) {
grunt.log.writeln(message);
});
This does not work:
bower.commands.install.line(['--save', 'git#github.com:foo/bar.git'])
.on('end', function(data) {
grunt.log.writeln(data);
done();
})
.on('err', function(err) {
grunt.log.fail(err);
done();
});
I get the following error:
$ grunt my-task
Running "my-task:default_options" (my-task) task
Fatal error: Could not find any dependencies
What is the right way to do this?
The line() function expects the whole argv, so should be:
bower.commands.install.line(['node', 'bower', '--save', 'git#github.com:foo/bar.git']);
However, you should rather just pass paths and options to the install() method directly:
bower.commands.install(['git#github.com:foo/bar.git'], {save: true});