You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I've got a weird gulp watch issue: if i make a change to a lower level (subfolder) scss file, gulp watches, and looks like it updates ok, but nothing actually changes.
I have to "touch" / save the style.scss file for it to actually take effect.
There was no change made to any structure or anything to cause this and it used to work just fine.
Has anyone seen this before?
This is the file we use.
`var gulp = require('gulp');
var sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
var browserSync = require('browser-sync').create();
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var cssvariables = require('postcss-css-variables');
var calc = require('postcss-calc');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-terser');
// js file paths
var utilJsPath = 'main/assets/js'; // util.js path - you may need to update this if including the framework as external node module
var componentsJsPath = 'main/assets/js/components/*.js'; // component js files
var scriptsJsPath = 'main/assets/js'; //folder for final scripts.js/scripts.min.js files
// css file paths
var cssFolder = 'main/assets/css'; // folder for final style.css/style-custom-prop-fallbac.css files
var scssFilesPath = 'main/assets/css/**/*.scss'; // scss files to watch
function reload(done) {
browserSync.reload();
done();
}
Hi,
I've got a weird gulp watch issue: if i make a change to a lower level (subfolder) scss file, gulp watches, and looks like it updates ok, but nothing actually changes.
I have to "touch" / save the style.scss file for it to actually take effect.
There was no change made to any structure or anything to cause this and it used to work just fine.
Has anyone seen this before?
This is the file we use.
`var gulp = require('gulp');
var sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
var browserSync = require('browser-sync').create();
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var cssvariables = require('postcss-css-variables');
var calc = require('postcss-calc');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-terser');
// js file paths
var utilJsPath = 'main/assets/js'; // util.js path - you may need to update this if including the framework as external node module
var componentsJsPath = 'main/assets/js/components/*.js'; // component js files
var scriptsJsPath = 'main/assets/js'; //folder for final scripts.js/scripts.min.js files
// css file paths
var cssFolder = 'main/assets/css'; // folder for final style.css/style-custom-prop-fallbac.css files
var scssFilesPath = 'main/assets/css/**/*.scss'; // scss files to watch
function reload(done) {
browserSync.reload();
done();
}
gulp.task('sass', function() {
return gulp.src(scssFilesPath)
.pipe(sassGlob())
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(postcss([autoprefixer()]))
.pipe(gulp.dest(cssFolder))
.pipe(browserSync.reload({
stream: true
}))
.pipe(rename('style-fallback.css'))
.pipe(postcss([cssvariables(), calc()]))
.pipe(gulp.dest(cssFolder));
});
gulp.task('scripts', function() {
return gulp.src([utilJsPath+'/util.js', componentsJsPath])
.pipe(concat('scripts.js'))
.pipe(gulp.dest(scriptsJsPath))
.pipe(browserSync.reload({
stream: true
}))
.pipe(rename('scripts.min.js'))
.pipe(uglify({
mangle: false,
ecma: 6
}))
.pipe(gulp.dest(scriptsJsPath))
.pipe(browserSync.reload({
stream: true
}));
});
gulp.task('browserSync', gulp.series(function (done) {
browserSync.init({
server: {
baseDir: 'main'
},
notify: false
})
done();
}));
gulp.task('watch', gulp.series(['browserSync', 'sass', 'scripts'], function () {
gulp.watch('main/.html', gulp.series(reload));
gulp.watch('main/assets/css/**/.scss', gulp.series(['sass']));
gulp.watch(componentsJsPath, gulp.series(['scripts']));
}));
`
The text was updated successfully, but these errors were encountered: