Why Gulp runs without errors but is not compiling the SCSS scripts? - gulp

Question

I setted up my Gulpfile and so far it looked good. I had no errors anymore. Just looked a bit too fast as he compiled it. But if he would really do the job this wouldn't be any problem. But as i run my gulp css task it didn't compiled my SCSS files into CSS and also not created the minified, concatinated build file afterwards. I checked paths and searched for solutions in internet but this doesn't helped me further.
I had no errors. So why he don't do the job? Did i made a mistake in the gulpfile? I used for running the task async functions to avoid an error. But it seems it just let disappear errors but it doesn't work. Has anybody an idea what i need to change?
Thats what my console does after running gulp css:
[08:58:02] Using gulpfile C:\xampp\htdocs\united-in-faith\gulpfile.js
[08:58:02] Starting 'css'...
[08:58:02] Finished 'css' after 3.71 ms
Thats my gulpfile:
const { src, dest, watch, task, series, parallel } = require('gulp');
var sass = require('gulp-sass');
var minifyCss = require('gulp-clean-css');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
var minifyPhp = require('gulp-php-minify');
var sourcemaps = require('gulp-sourcemaps');
var scssOrigin = './scripts/scss/**/_*.scss';
var jsOrigin = './scripts/js/*.js';
var cssFilePath = './scripts/css/**/_*.css';
var jsDestination = './build/scripts/js';
var cssDestination = './scripts/scripts/css';
var cssDestinationMin = './build/scripts/css';
var jsDestinationMin = './build/scripts/js';
var phpDestination = './build';
var htmlDestination = './build';
var appCssMin = 'app.min.css';
var appJsMin = 'app.min.js';
var appJs = 'app.js';
var appCss = 'app.css';
var watchJs = './scripts/js/**/_*.js';
var watchCss = './scripts/scss/**/_*.scss';
function js(done) {
src(jsOrigin)
.pipe(concat({ path: appJsMin}))
.pipe(uglify())
.pipe(dest(jsDestinationMin));
done();
}
function css(done) {
var processors = [
autoprefixer,
];
src(scssOrigin, { sourcemaps: true})
.pipe(sourcemaps.init())
.pipe(sass({ outputStyle: "expanded" }).on('error', sass.logError))
.pipe(sourcemaps.write('./maps'))
.pipe(postcss(processors))
.pipe(dest(cssDestination));
src('scripts/scss/main.scss', { sourcemaps: true})
.pipe(sass({ outputStyle: "expanded" }).on('error', sass.logError))
.pipe(dest('scripts/css'));
done();
}
function minifyCss (done) {
return src(cssFilePath, { sourcemaps: true})
.pipe(sourcemaps.init())
.pipe(minifyCss({compatibility: 'ie8'}))
.pipe(concat(appCssMin))
.pipe(sourcemaps.write('./maps'))
.pipe(dest(cssDestinationMin));
}
/*function cssNoMin (done) {
var processors = [
autoprefixer,
];
src(scssOrigin, { sourcemaps: true})
.pipe(sass({ outputStyle: "expanded" }).on('error', sass.logError))
.pipe(postcss(processors))
.pipe(dest(cssFilePath));
src(cssFilePath, { sourcemaps: true})
.pipe(concat(appCss))
.pipe(dest(scssDestinationMin))
.pipe(browserSync.stream());
done();
}
*/
function jsNoMin (done) {
src(jsOrigin)
.pipe(concat({ path: appJs }))
.pipe(dest(jsDestinationMin))
.pipe(browserSync.stream());
done();
}
function browserSyncServer (done) {
browserSync.init({
open: false,
injectChanges: true,
server: { //server variable set elsewhere
baseDir: './',
proxy: "https://localhost/united-in-faith",
port: 8080,
online: true
},
ui: {
port: 8082
}
});
done();
}
function browserSyncReload (done) {
browserSync.reload();
done();
}
function publishPhp () {
return src('sites/**/*php')
.pipe(dest(phpDestination));
src('sites/**/*html')
.pipe(dest(phpDestination));
}
function watch_files () {
watch('*.php', browserSyncReload);
watch([watchJs,watchCss], series(css,minifyCss, js, browserSyncReload))
.on('error', function (err) {
console.log(err.toString());
this.emit('end');
});
}
function watchNoMin () {
watch('*.php', browserSyncReload);
watch([watchJs,watchCss], series(css, jsNoMin , browserSyncReload))
.on('error', function (err) {
console.log(err.toString());
this.emit('end');
});
}
task("default", async function() {
series(css,minifyCss,js,browserSyncServer);
});
task("css", async function() {
series(css,minifyCss,browserSyncServer);
});
task("js", async function() {
series(js,browserSyncServer);
});
task("publish", async function() {
series(css, minifyCss,js,publishPhp,browserSyncServer);
});
task("watch", series(watch_files, browserSyncServer));
task("watch-no-min", series(watchNoMin, browserSyncServer));
task("all", parallel(css,js));
task("css-no-min", css);
task("js-no-min", js);
Thats my dependencies of Package.json
"dependencies": {
"lodash": "^4.17.21",
"#fortawesome/fontawesome-pro": "^6.0.0-beta1",
"bootstrap": "^5.0.1",
"bootstrap-icons": "^1.5.0",
"ckeditor4": "^4.16.1",
"cookieconsent": "^3.1.1",
"emojione": "^4.5.0",
"gulp-php-minify": "^0.1.3",
"jquery": "^3.6.0",
"jquery-ui": "^1.12.1",
"jquery-ui-touch-punch": "^0.2.3"
},
"devDependencies": {
"q": "^1.5.1",
"autoprefixer": "^10.2.6",
"browser-sync": "^2.26.14",
"chokidar": "^3.5.2",
"debug": "^4.3.1",
"gulp": "^4.0.2",
"gulp-clean-css": "^4.3.0",
"gulp-cli": "^2.3.0",
"gulp-concat": "^2.6.1",
"gulp-postcss": "^9.0.0",
"gulp-sass": "^4.1.0",
"gulp-sourcemaps": "^3.0.0",
"gulp-uglify": "^3.0.2",
"gulp-watch": "^5.0.1",
"webpack": "^5.40.0",
"webpack-cli": "^4.7.2"
}