Laravel Elixir: Gulp watch fires without any interaction - gulp

I have the following set up within the assets/sass folder:
app.scss
- partials
_settings.scss
_main.scss
Now the issue is that when i run gulp watch, it runs all ok as a normal gulp, but then it just repeats the sass process, even when I have not touched anything, have anything in the files etc
It constantly runs the following over and over, sometime constantly or after a few seconds: The below is the loop thats is spat out within the terminal.
[20:49:30] Starting 'sass'...
[20:49:30] Running Sass: resources/assets/sass/app.scss
[20:49:30] gulp-notify: [Laravel Elixir] Sass Compiled!
[20:49:30] Finished 'sass' after 23 ms
Now doing several tests to see whats causing this, if i have DONT have any files with in the partials directory and just have code within the app.scssthen the gulp watchruns and simply waits for changes.
But as soon as I add a file within the sass folder or in the partials folder the gulp watch runs as I would expect, BUT this then never stops running the script...
I am using a simple elixir set up, for now:
elixir(function(mix) {
mix.sass('app.scss', 'public/js/main.css');
});
Any ideas why this is.
Running on a Homestead VM latest
Using latest elixir version
Laravel v.5.1.13
EDIT: Update
I was doing this outside the VM so thought to try to run this through the VM and it seems to be OK and run as expected...

I am running this outside the VM and so when run within the VM its runs as expected. But i do get the Error in plugin 'gulp-notify' not found: notify-senderror, but i can turn this off via adding process.env.DISABLE_NOTIFIER = true; to the top of the gulp file.

Related

grunt build getting stuck in running task (ngtemplates:dist)

This is on an existing project where I have setup npm,bower. "grunt build --force" worked fine in the initial run.
A few days later, with changes in some files (.html, .css, .py) I've been trying to run the "grunt build" / "grunt build --force". After running, the progress is stuck at ""running "ngtemplates:dist" (ngtemplates) task"" and has never ended.
Don't know what seems to be the problem.
The cause turned out to be an extra double quote symbol in one of the HTML

Disable aurelia-bundler just on dev machine?

I've been working on an Aurelia app without gulp and it has gone well. Now I want to use gulp b/c the page loads are terrible with 100+ separate files being requested. I install aurelia-bundler from the skeleton and can get it working using gulp. But there are two problems:
1. I have to gulp bundle after EVERY change to refresh the page
2. The error messages make no sense b/c everything is minified now.
I can deal with #1 b/c of gulp-watch (even though that still takes time), but I can't handle the minified files and not being able to debug my code.
So, is there and easy way to switch back to the non-bundled files for development on my machine and only use the bundled files when I deploy to Heroku server? It seems like aurelia-bundle now points to the dist folder by default.
Oh yeah, I tried modifying config.js to point to "src" instead of "dist" but it still looks for the aurelia-xxx.js file instead of the non-bundled files.
Thanks.
If you are using the latest build files you can gulp watch in dev which should use the src files without bundling - of course, this is slower, but in conjunction with browser-sync you shouldn't have to do loads of refreshes.
Check your paths.js and other config files against the skeleton if gulp watch is also bundling.

Gulp 4 watcher is running but does not detect changes

I'm having the following file structure:
/ src
-- app.less
/ gulp
-- index.js
-- gulpfile.js
This file structure is mounted in a vagrant box in /vagrant which means the path to app.less becomes /vagrant/src/app.less. Yes, I've checked this.
gulpfile.js
require('./gulp');
index.js
var paths = {
less: '/vagrant/src/app.less'
};
gulp.task('less', function () {
console.log('less function running');
return gulp.src(paths.less)
.pipe(less());
});
gulp.task('watch:styles', function () {
console.log('watch function running');
gulp.watch(paths.less, gulp.series('less'));
});
gulp.task('watch', gulp.parallel('watch:styles'));
gulp -v returns:
[10:02:05] CLI version 0.4.0
[10:02:05] Local version 4.0.0-alpha.1
gulp watch returns:
[09:45:20] Using gulpfile /vagrant/gulpfile.js
[09:45:20] Starting 'watch'...
[09:45:20] Starting 'watch:styles'...
watch function running
I've been using Gulp 4 for over 2 months without problems with the watcher. Since last week the watcher is not responding to files that are being changed. I've tried several editors, I've tried multiple paths like '/vagrant/**/*.less' and '../src/*.less' and even the absolute path to app.less '/vagrant/src/app.less', none of them worked.
After some research I found several issues on the github repo of Gulp 4 about the watcher. Yet, I can't figure out what the problem is. Maybe I'm overlooking an error in my code or something new in the docs, but I'm trying to solve this since yesterday morning without any luck.
It appears you're using Vagrant. If you have Gulp running on your Vagrant machine instead of on the host it won't detect any changes to files that you make on the host. This is because the events that notify the OS about filesystem changes don't propagate into the VM.
If this is the case, the solution is to simply run Gulp wherever you actually make changes to the files (i.e. if you make the changes on the VM, run it on the VM, if you make changes on the host, run Gulp on the host).
Also maybe make the path relative, instead of tying your implementation to your Vagrant box. i.e. less: './src/app.less'.

Using gulp to run a asset download script

I have an isolated npm module with assets. I want to add gulp to this. Inside the project aside from my assets i have a bash script that downloads and updates my assets. I have been trying to find a way to create a gulp task that can run this script but i have not yet been able to get it to work. I tried the following and although it ran it did not run the script.
gulp.task('update-json', function(){
gulp.src('assets/update_json.sh');
});

Run Gulp Task in Codekit Hook

I'm trying to run a Gulp task as a Codekit Hook after compiling JS files.
I've created a new Hook and put in the following command:
cd /path/to/my/web/project/
gulp default
I just want to run a gulp task everytime Codekit has compiled my JS files. But nothing happens. What i'm doing wrong?
If i run that task in the terminal, everything is fine.
Thanks for any help.
My solution was to make a Shell Script and link directly to it in the Codekit Hook:
E.g.:
./rungulptasks.sh
Inside the "rungulptasks.sh" file I put a direct link to the local gulp bin:
node_modules/.bin/gulp
Now it works. Solved.
P.S Don't forget to make the script executable.