When I try to gulp watch, I get the following error:
[15:46:56] Task never defined: watch
[15:46:56] To list available tasks, try running: gulp --tasks
Here are my functions from gulpfile.js.
function watchChanges(cb) {
watch(['assets/js/*.js'], parallel(buildSiteJS));
watch(['assets/scss/style.scss', 'assets/scss/**/*.scss'], parallel(compileStyleSCSS));
watch(['**/*.php'], parallel(reloadPage));
cb();
}
With the ending export statement like:
exports.default = parallel(serveBrowserSync, mainTasks, watchChanges);
I'm not sure if the syntax is incorrect causing the 'task never defined' error and I've tried a lot of searching online and not got anywhere with it.
Let me know if you need to see more of the gulpfile.js.
Gulp: 4.0.2
Gulp Babel: 8.0.0
Related
I am trying to use gulp-compass plugin to convert and minify my scss into css.
However I am getting below error:
$ gulp compass [02:14:32] Using gulpfile C:\Users\dell\Desktop\sassy -
copy\gulpfile.js [02:14:32] Starting 'compass'... [02:14:32] Finished
'compass' after 13 ms [02:14:33] LoadError on line ["55"] of C: cannot
load such file -- bourbon Run with --trace to see the full backtrace
events.js:160
throw er; // Unhandled 'error' event
^ Error: Compass failed
This is how my scss file looks like:
.scss file:
#import 'bower_components/bourbon/app/assets/stylesheets/bourbon';
#import 'bower_components/normalize-css/normalize';
#import 'bower_components/susy/sass/susy';
#import url('https://fonts.googleapis.com/css?family=Playfair+Display|Raleway');
#import 'partials/variables';
#import 'partials/base';
#import 'partials/footer';
#import 'partials/header';
#import 'partials/layout';
#import 'partials/modules';
Following is gulpfile.js:
var gulp = require('gulp'),
compass = require('gulp-compass'),
minifyCSS = require('gulp-minify-css');
gulp.task('compass', function() {
gulp.src('assets/scss/styles.scss')
.pipe(compass({
sass: 'assets/sass',
image: 'images',
require:['bourbon', 'normalize','susy']
}))
.pipe(minifyCSS())
.pipe(gulp.dest('css'));
});
I guess its not letting plugins like bourbon, normalize,susy to compile and convert. I might have done some wrong configuration I guess.
Tried installing gems but throws the following error:
gem install susy
gem install bourbon
c:\Users\Dell\Desktop\sassy - Copy>gulp compass
[23:23:59] Using gulpfile c:\Users\Dell\Desktop\sassy - Copy\gulpfile.js
[23:23:59] Starting 'compass'...
[23:23:59] Finished 'compass' after 14 ms
error assets/sass/styles.scss (Line 1: File to import not found or unreadable: bower_components/bourbon/app/assets/stylesheets/bourbon.
Load paths:
Compass::SpriteImporter
c:/Users/Dell/Desktop/sassy - Copy/assets/sass
C:/Ruby24/lib/ruby/gems/2.4.0/gems/compass-core-1.0.3/stylesheets
C:/Ruby24/lib/ruby/gems/2.4.0/gems/susy-2.2.12/sass
C:/Ruby24/lib/ruby/gems/2.4.0/gems/bourbon-4.3.4/app/assets/stylesheets)
Compilation failed in 1 files.
events.js:160
throw er; // Unhandled 'error' event
^
Error: error assets/sass/styles.scss (Line 1: File to import not found or unreadable: bower_components/bourbon/app/assets/stylesheets/bourbon.
Load paths:
Compass::SpriteImporter
c:/Users/Dell/Desktop/sassy - Copy/assets/sass
C:/Ruby24/lib/ruby/gems/2.4.0/gems/compass-core-1.0.3/stylesheets
C:/Ruby24/lib/ruby/gems/2.4.0/gems/susy-2.2.12/sass
C:/Ruby24/lib/ruby/gems/2.4.0/gems/bourbon-4.3.4/app/assets/stylesheets)
Compilation failed in 1 files.
The reason is quite simple, the required are Ruby gems, not bower or node libraries.
From the doc,
Require the given Ruby library before running commands. This is used to access Compass plugins without having a project configuration file.
If you do not install the Ruby gems, you can require them.
gem install susy
gem install bourbon
It seems normalize-css does not have a Ruby gem.
The new error:
This question may help you Why is Compass is giving me an import error when trying to import partials, you need to use relative path, otherwise It will search the required Ruby gem path.(I think you have bower packages installed).
So changes #import 'bower_components/bourbon/app/assets/stylesheets/bourbon'; to
#import './bower_component/.. and all things alike.
I have a gulp task to build up everything which runs for dev (works fine). On release gulp task we do the same but also tack on a bundle task which also minifies the css.
I want to just minify the css inline, meaning the same src and dest for the file; however, I am getting the below error when running.
Error: EACCES: permission denied, open
I don't think I'm hitting any race conditions since my build task shows as finished before the minify starts
[15:11:48] Finished 'build_client_lib' after 3.31 s
[15:11:48] Starting 'build'...
[15:11:48] Finished 'build' after 1.67 μs
[15:11:48] Starting 'minify-css'...
[15:11:48] 'minify-css' errored after 344 ms
The tasks in question are:
gulp.task('release', callback => {
gulpSequence('clean_packages', 'build', 'client_lib_bundle')(callback)
});
gulp.task('client_lib_bundle', ['minify-css'], () => {
});
gulp.task('minify-css', () => {
return gulp.src('build/client_lib/**/*.css')
.pipe(cleanCSS())
.pipe(gulp.dest('build/client_lib'));
});
It works fine is I specify an alternate dest path, but I'd prefer not to do that. How can I resolve this access issue?
Turns out the package I was using gulpSequence caused this, and a slew of other items, to run in an awkwardly async manner. Changing to the npm package run-sequence cleared all this up and ensures everything is running in the correct order.
Using Gulp 4 and the recipe for splitting my tasks into multiple files using gulp-hub throws this error just from attempting to load the task files. The task file is super simple just wanted to test everything was working.
I found this reference on Undertaker on Github for the get function, but I really don't understand what they are trying to say, and it seems like gulp-hub is supposed to be doing the lifting.
Anyone else run into this and know how to solve it?
Gulp File
'use strict';
var gulp = require('gulp');
var HubRegistry = require('gulp-hub');
// Load some files into the registry
var hub = new HubRegistry(['gulp/tasks/*.js']); // only one file help.js
// Tell gulp to use the tasks just loaded
gulp.registry(hub);
Help Task - /gulp/tasks/help.js
'use strict';
var gulp = require('gulp');
gulp.task('help', []);
Error Thrown
$ gulp help
[01:36:37] Loading gulp\tasks\help.js
D:\projects\app\node_modules\undertaker\lib\helpers\validateRegistry.js:36
throw err;
^
AssertionError: Custom registry must have `get` function
at validateRegistry (D:\projects\app\node_modules\undertaker\lib\helpers\validateRegistry.js:28:5)
at Gulp.registry (D:\projects\app\node_modules\undertaker\lib\registry.js:17:3)
at Object.<anonymous> (D:\projects\app\gulpfile.js:11:6)
at Module._compile (module.js:541:32)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
You are probably running gulp-hub#0.8.0 which is the version that is currently published to npm and is designed for gulp 3.x.
For gulp 4.x you need to install gulp-hub from one of the development branches on GitHub. Currently there's 4.0 and registry-init.
The 4.0 branch doesn't work right now because it fails the registry validation of undertaker.
The registry-init branch seems to work however. You can install it like this:
npm uninstall gulp-hub
npm install --save-dev frankwallis/gulp-hub#registry-init
Update on 12.10.2016
I work with yeoman-fountainjs and in their package.json is the following dev-dependency definied, which works like a charm:
"gulp": "gulpjs/gulp#4ed9a4a3275559c73a396eff7e1fde3824951ebb",
"gulp-hub": "frankwallis/gulp-hub#d461b9c700df9010d0a8694e4af1fb96d9f38bf4",
I ran into the same error but it was because I failed to expose the tasks correctly to Gulp.
At first I was using CommonJS like this in my help.js file and getting the same error:
exports.help = help;
So I changed it to a Gulp task and it worked:
gulp.task("help", help);
When I run my back-end test, codeship mentions that nothing is returned:
13 specs, 0 failures
Finished in 0 seconds
[16:31:49] Finished 'testBECodeship' after 5.34 s
This command didn't output anything for for a while, thus we stopped it. If the error is on our end please inform us so we can help you to fix this.
Gulp Code:
gulp.task('testBECodeship', function () {
return gulp.src(paths.specs + '/backend/**/*.spec.js')
.pipe($.jasmine({verbose: true}));
});
I also could use just jasmine but I have also front-end tests run with gulp, which require more configuration. Also it would be nice to have the same on my dev. systems as on the CI-System.
Ahoy Andi, Marko from the Codeship crew here. We have seen some issues with running jasmine via Gulp as it seems the plugin will wait for changes to the files and not exit cleanly. Running jasmine directly without Gulp will work though!
In a simple gulp + browser-sync project here, all file add/delete/change are working correctly, but when I delete a directory from app gulp/browser-sync throws an error like below:
events.js:72
throw er; // Unhandled 'error' event
^
Error: watch EPERM
at errnoException (fs.js:1030:11)
at FSEvent.FSWatcher._handle.onchange (fs.js:1048:26)
I am not sure where to look for possible problems. If someone can point me to correct direction.
The problem here was an outdated version of BrowserSync.
Updating to the latest version will solve this issue.