SCSS not compiling to CSS in Dist folder

SCSS not compiling to CSS in Dist folder
0.0 0

#1

If I directly add css styling to /assets/src/scss/app.scss it works perfectly, but when I put this in the same file it would not recompile them to Dist folder…

@import "node_modules/bootstrap/scss/functions";
@import "node_modules/bootstrap/scss/variables";
@import "node_modules/bootstrap/scss/mixins";
@import "node_modules/bootstrap/scss/reboot";
@import "node_modules/bootstrap/scss/navbar";
@import "config";
'use strict';

const gulp = require('gulp');
const sass = require('gulp-sass');

gulp.task('sass', function () {
  return gulp.src('src/scss/app.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('dist/css') );
});
 
gulp.task('default', function () {
  gulp.watch('src/scss/**/*.scss', ['sass']);
});

#2

Is that ‘t’ typo on the top import statement in the program or is that typo something you accidentally added when you wrote this post?


#3

Are you getting any logged errors?


#4

Accidentally added when I was typing this post.


#5

No single error, so that is quite weird.


#6

Not sure if it makes a difference, but you could add ./ to prefix the src and dist folders. Also, you don’t need to use strict mode within Gulp files. Otherwise, it’s not obvious to me why your gulp.dest() wouldn’t work.


#7

Found the answer, when you import something that does not exist it wouldn’t load anything. So be careful with typos.