简体   繁体   中英

Gulp watch not watching

I am having some issues with my gulpfile configuration when I edit main.scss, gulp watch is running in the terminal but it does not detect the changes made in main.scss, but when I run gulp.sass, it detects the changes, I have looked through some of the other "gulp watch issues" and I still can't find a fix, what am I doing wrong? Let me know if it needs to be more clear

Folder directory - 
weather-app
 ---node_modules
 ---public
    ---css
        ---main.css
    ---js
        ---main.js
 ---index.html
 ---src
    ---sass
        ---main.scss
        ---mobile.scss
    ---js
        ---main.js
 ---gulpfile.js
 ---package-lock.json
 ---package.json

 const gulp = require('gulp'), sass = require('gulp-sass'), uglifyCss = require('gulp-uglifycss'), concatCss = require('gulp-concat-css'); gulp.task('sass', () => { gulp.src('src/sass/*.scss') .pipe(sass()) .pipe(uglifyCss({ 'uglyComments': true })) .pipe(concatCss('main.css')) .pipe(gulp.dest('public/css')) }) gulp.task('default', ['sass']); gulp.task('watch', () => { gulp.watch('src/sass/*.scss', ['watch']) }) 

gulp.watch mustn't be a returned value.
Don't forget to use the double asterisk as well, for targeting any .scss file inside your sass folder.

About the ** glob character

gulp.task('watch', function() {
  gulp.watch('src/sass/**/*.scss', ['watch'])
})

gulp.watch('src/sass/**/*.scss', ['watch'])监视行更改为gulp.watch('src/sass/**/*.scss', ['watch'])

 const gulp = require('gulp'), sass = require('gulp-sass'), uglifyCss = require('gulp-uglifycss'), concatCss = require('gulp-concat-css'); gulp.task('sass', () => { gulp.src('src/sass/**/*.scss') // gulp.src('src/sass/*.scss') .pipe(sass()) .pipe(concatCss('main.css')) .pipe(uglifyCss({ 'uglyComments': true })) .pipe(gulp.dest('public/css')) }) gulp.task('default', ['watch']); //i changed 'sass' to 'watch' gulp.task('watch', function () { gulp.watch('src/sass/**/*.scss', ['sass']) }) 

thanks, everyone for contributing, I fixed it, it was a minor error I overlooked

This is the wrong line:

gulp.task('default', ['sass']);

So you must call watch as default task. So this is solution:

gulp.task('default', ['watch']);

AND this line change from

 gulp.watch('src/sass/*.scss', ['watch'])

to

 gulp.watch('src/sass/*.scss', ['sass'])

That's all. :)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM