gulp-tslint return undefined when required - gulp

this is my gulpfile:
/*jslint maxlen:160*/
(function (require) {
"use strict";
var gulp, tslint;
gulp = require('gulp');
tslint = require('gulp-tslint');
gulp.task("tslint", function() {
return gulp.src(["src/**/*.ts"])
.pipe(tslint())
.pipe(tslint.reporter("verbose"));
});
}(require));
when I run gulp tslint from command line I get this error:
[17:26:58] Using gulpfile /var/www/tests/gulp_error/gulpfile.js
[17:26:58] Starting 'tslint'... [17:26:58] 'tslint' errored after 6.08
ms [17:26:58] TypeError: undefined is not a function
at Gulp. (/var/www/tests/gulp_error/gulpfile.js:9:36)
at module.exports (/var/www/tests/gulp_error/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
at Gulp.Orchestrator._runTask (/var/www/tests/gulp_error/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
at Gulp.Orchestrator._runStep (/var/www/tests/gulp_error/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
at Gulp.Orchestrator.start (/var/www/tests/gulp_error/node_modules/gulp/node_modules/orchestrator/index.js:134:8)
at /home/username/.nvm/versions/node/v0.12.12/lib/node_modules/gulp/bin/gulp.js:129:20
at process._tickCallback (node.js:355:11)
at Function.Module.runMain (module.js:503:11)
at startup (node.js:129:16)
at node.js:814:3
what I'm doing wrong here?
Here's a Github repository with the code.

Related

"Task function must be specified at Gulp.set" error when running gulp

I always have the same error when installing gulp:
C:\Users\Thomas\Desktop\Sites CT Graphics\colpaertmarc.be>gulp
assert.js:350
throw err;
^
AssertionError [ERR_ASSERTION]: Task function must be specified
at Gulp.set [as _setTask] (C:\Users\Thomas\Desktop\Sites CT Graphics\colpaertmarc.be\node_modules\undertaker\lib\set-task.js:10:3)
at Gulp.task (C:\Users\Thomas\Desktop\Sites CT Graphics\colpaertmarc.be\node_modules\undertaker\lib\task.js:13:8)
at Object. (C:\Users\Thomas\Desktop\Sites CT Graphics\colpaertmarc.be\gulpfile.js:19:6)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
This error occurs after you upgrade your gulp version from 3.* to 4.*.
If you don't want to downgrade gulp, then you will have to rewrite gulp tasks to be valid with v4 api. Here is example how to rewrite simple gulp task from api notation used in v3 to notation compatiable with v4.
Gulp v3
var gulp = require('gulp');
// Deleting resources task
gulp.task('clearResources', function() {
console.log('Deleting resources');
});
// Default gulp task
gulp.task('default', ['clearResources'], function() {
console.log('Running default task');
});
Gulp v4
var gulp = require('gulp');
// Delete resources function
function clearResources() {
console.log('Deleting resources');
};
// Gulp task(s)
exports.clear = clearResources;
exports.default = gulp.series(clearResources);
It seems to be related to the Gulp V4, there's two options:
Update your code to V4 (Article related )
OR
Downgrade gulp version
To downgrade you need to update your package.json with
"gulp": "^3.9.1",
And then remove node_module folder and reinstall npm packages
rm -rf node_modules
npm install
GULP 4
const { series, parallel } = require('gulp');
gulp.task('clear', gulp.series( async function(){
// your code
}));
gulp.task('build', gulp.series( async function(){
// Your code
}));
gulp.task('watch', function(){
gulp.watch('./javascripts/**/*.js', gulp.series('clear','build'));
});
gulp.task('default', gulp.series('clear','build','watch'));
When I had upgraded the gulp version from ^3.9.1 to ^4.0.2, It worked. Maybe, this code will help you.

gulp: PostCSS failing - postcss version higher than version of postcss-import

Im trying to transform my css with PostCss using Gulp.
When I add the cssnext plugin to PostCss I get the following error:
Unknown error from PostCSS plugin. Your current PostCSS version is 6.0.19, but postcss-import uses 4.1.16. Perhaps this is the source of the error below.
This is my gulpfile.js:
const gulp = require('gulp');
const postcss = require('gulp-postcss');
const concat = require('gulp-concat');
gulp.task('styles', function() {
const postCssPlugins = [
require('cssnext')()
];
gulp.src('src/css/*.css')
.pipe(postcss(postCssPlugins))
.pipe(concat('style.css'))
.pipe(gulp.dest('.'));
});
Full stack trace:
events.js:183
throw er; // Unhandled 'error' event
^
TypeError: styles.eachAtRule is not a function
at parseStyles (C:\gulp-test\node_modules\cssnext\node_modules\postcss-import\index.js:134:10)
at C:\gulp-test\node_modules\cssnext\node_modules\postcss-import\index.js:84:30
at LazyResult.run (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:192:32)
at processing.Promise.then._this2.processed (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:231:20)
at new Promise (<anonymous>)
at LazyResult.async (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:228:27)
at LazyResult.then (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:134:21)
at process._tickCallback (internal/process/next_tick.js:188:7)
As far as I know, the postcss-import package is a dependency of cssnext. So what should I do?
I found the answer:
According to the website of cssnext, the package cssnext (which I used) is dead. The new package to use with PostCSS is postcss-cssnext:
const postCssPlugins = [
require('postcss-cssnext')()
];

Gulp doesn't create link to a folder

Can not create a symbolic link to the /var/www/project/bower_components/bootstrap/less/mixins folder via Gulp JS. I tried to specify the desired path via the nodeJS.
VARIANT 1
CODE:
var gulp = require('gulp');
var path = require('path');
var debug = require('gulp-debug');
var symlink = require('gulp-sym');
gulp.task('symlink-deploy', function () {
var mixins = gulp
.src('' + path.resolve() + 'bower_components/bootstrap/less/mixins/')
.pipe(symlink('' + path.resolve() + 'assets/less/'))
.pipe(debug({title: 'unicorn:'}));
return Promise.all([mixins]);
});
gulp.task('default', ['symlink-deploy']);
RESULT:
user#user-ThinkPad-Edge-E545:/var/www/project$ gulp symlink-deploy
[17:18:44] Using gulpfile /var/www/project/gulpfile.js
[17:18:44] Starting 'symlink-deploy'...
[17:18:44] Finished 'symlink-deploy' after 28 ms
events.js:141
throw er; // Unhandled 'error' event
^
Error: EISDIR: illegal operation on a directory, read
at Error (native)
user#user-ThinkPad-Edge-E545:/var/www/project$
I have also was tried set path manually:
VARIANT 2
CODE:
var gulp = require('gulp');
var path = require('path');
var debug = require('gulp-debug');
var symlink = require('gulp-sym');
gulp.task('symlink-deploy', function () {
var mixins = gulp
.src('/home/user/www/project/bower_components/bootstrap/less/mixins')
.pipe(symlink('/home/user/www/project/assets/less'))
.pipe(debug({title: 'unicorn:'}));
return Promise.all([mixins]);
});
gulp.task('default', ['symlink-deploy']);
RESULT:
user#user-ThinkPad-Edge-E545:/var/www/project$ gulp symlink-deploy
[17:57:55] Using gulpfile /var/www/project/gulpfile.js
[17:57:55] Starting 'symlink-deploy'...
[17:57:55] Finished 'symlink-deploy' after 27 ms
events.js:141
throw er; // Unhandled 'error' event
^
Error: Destination file exists (/home/user/www/project/assets/less) - use force option to replace
at Transform._transform (/var/www/project/node_modules/gulp-sym/index.js:55:26)
at Transform._read (/var/www/project/node_modules/gulp-sym/node_modules/readable-stream/lib/_stream_transform.js:184:10)
at Transform._write (/var/www/project/node_modules/gulp-sym/node_modules/readable-stream/lib/_stream_transform.js:172:12)
at doWrite (/var/www/project/node_modules/gulp-sym/node_modules/readable-stream/lib/_stream_writable.js:237:10)
at writeOrBuffer (/var/www/project/node_modules/gulp-sym/node_modules/readable-stream/lib/_stream_writable.js:227:5)
at Transform.Writable.write (/var/www/project/node_modules/gulp-sym/node_modules/readable-stream/lib/_stream_writable.js:194:11)
at write (/var/www/project/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:623:24)
at flow (/var/www/project/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:632:7)
at DestroyableTransform.pipeOnReadable (/var/www/project/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:664:5)
at emitNone (events.js:67:13)
user#user-ThinkPad-Edge-E545:/var/www/project$
Can't understand why it is't working.

Gulp: How to run multiple instances of gulp?

It used to work, if I run gulp with one or few instances already running, it will find new port (3001, 3002, 3003, 3004, [...]) and run without any issue.
I tweaked code occasionally and then I noticed that it doesn't work anymore. I don't know when it stopped working and what changed. It demands to run on only port 3000, without automatically finding new port and running on it.
Can anyone look at my gulpfile.js to see anything that is stopping from multiple instances running?
Error:
λ gulp
[19:32:57] Using gulpfile D:\Dev\Projects\NASDAQ\gulp\gulpfile.js
[19:32:57] Starting 'sass'...
[19:32:57] Finished 'sass' after 29 ms
[19:32:57] Starting 'serve'...
[19:33:07] Finished 'serve' after 10 s
[19:33:07] Starting 'default'...
[19:33:07] Finished 'default' after 5.43 μs
events.js:141
throw er; // Unhandled 'error' event
^
Error: listen EADDRINUSE :::3000
at Object.exports._errnoException (util.js:837:11)
at exports._exceptionWithHostPort (util.js:860:20)
at Server._listen2 (net.js:1231:14)
at listen (net.js:1267:10)
at Server.listen (net.js:1363:5)
at module.exports.plugin (D:\Dev\Projects\NASDAQ\gulp\node_modules\browser-sync\lib\server\index.js:24:25)
at Object.module.exports.startServer [as fn] (D:\Dev\Projects\NASDAQ\gulp\node_modules\browser-sync\lib\async.js:236:52)
at D:\Dev\Projects\NASDAQ\gulp\node_modules\browser-sync\lib\browser-sync.js:149:14
at iterate (D:\Dev\Projects\NASDAQ\gulp\node_modules\browser-sync\node_modules\async-each-series\index.js:8:5)
at D:\Dev\Projects\NASDAQ\gulp\node_modules\browser-sync\node_modules\async-each-series\index.js:16:16
gulpfile.js
var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var plumber = require('gulp-plumber');
var sass = require('gulp-sass');
// Static Server + watching scss/html files
gulp.task('serve', ['sass'], function() {
browserSync.init({
server: "..",
notify: false
});
gulp.watch("../assets/scss/*.scss", ['sass']);
gulp.watch("../**/*").on('change', browserSync.reload);
});
// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
return gulp.src("../assets/scss/*.scss")
.pipe(plumber())
.pipe(sass.sync().on('error', sass.logError))
.pipe(sass())
.pipe(gulp.dest("../assets/css"))
.pipe(browserSync.stream());
});
gulp.task('default', ['serve']);
I hope this issue can be resolved. Thanks.

Unable to run gulp task

I'm trying to run a simple gulp-sass task, but I'm getting this error:
[22:42:14] Starting 'sass'...
[22:42:14] Finished 'sass' after 10 ms
events.js:72
throw er; // Unhandled 'error' event
^
Error: File not found with singular glob
at Glob.<anonymous> (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\index.js:34:30)
at Glob.EventEmitter.emit (events.js:95:17)
at Glob._finish (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:171:8)
at done (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:158:12)
at Glob._processSimple2 (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:640:12)
at D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:628:10
at Glob._stat2 (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:724:12)
at lstatcb_ (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\glob.js:716:12)
at RES (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\node_modules\inflight\inflight.js:23:14)
at f (D:\Development\WebStorm\calliope\node_modules\gulp\node_modules\vinyl-fs\node_modules\glob-stream\node_modules\glob\node_modules\once\once.js:17:25)
I Installed gulp both globally and locally as dev depency.
Here's my task:
var gulp = require("gulp"),
sass = require("gulp-sass");
gulp.task("sass", function(){
gulp.src('assets/sass/*.scss')
.pipe(sass())
.pipe(gulp.dest('assets/css'))
});
The error is not so clear, by the way the Exception is throwed by a wrong link ( resource not found )
Yes, that is correct. The error is thrown whenever the resource is not found. I wrote a function to prevent such an occurrence in my files.
run "npm install fs --save".
then add this to your gulpfile
var fs = require('fs');
var validateResources = function (resources) {
resources.forEach(function (resource) {
if (!fs.existsSync(resource)) {
throw resource + " not found!";
}
});
};
With this, you will be safe to some extent.