Gulpfile for SCSS and Tailwind

gulpfile.js

var gulp = require('gulp');
var sass = require('gulp-sass');
var postcss = require('gulp-postcss');

gulp.task('style', function () {
    var tailwindcss = require('tailwindcss');

    return gulp.src('sass/**/*.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(postcss([
            tailwindcss('./tailwind.js'),
            require('autoprefixer'),
        ]))
        .pipe(gulp.dest('./'));
});

//Watch task
gulp.task('default',function() {
    gulp.watch('sass/**/*.scss',['style']);
});

Just to sum it all up, the resulting gulpfile.js is the following:

const gulp = require('gulp');
const postcss = require("postcss");
const sass = require('gulp-sass')(require('sass'));
const gulp_postcss = require('gulp-postcss');
const tailwindcss = require('tailwindcss');
const autoprefixer = require("autoprefixer");

const $sass_files = './*.scss'; // 'sass/**/*.scss';
const $tailwind_config = './tailwind.config.js';
const $dest_folder = 'css';

gulp.task('style', function () {
    return gulp.src($sass_files)
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp_postcss([
            tailwindcss($tailwind_config),
            autoprefixer()
        ]))
        .pipe(gulp_postcss([postcss(tailwindcss()), autoprefixer()]))
        .pipe(gulp.dest($dest_folder));
});

//Watch task
gulp.task('default', function() {
    gulp.watch($sass_files, gulp.series('style'));
});

Also, the package.json that worked for me is something similiar to the following:

    "name": "Gulp-sassy-tail",
    "scripts": {
        "sassy": "gulp",
        // ...
    },
    "dependencies": {
        "autoprefixer": "10.4.15",
        "gulp-cli": "^2.3.0",
        "gulp-postcss": "^9.0.1",
        "postcss": "8.4.28",
        "tailwindcss": "3.3.3"
    },
    "devDependencies": {
        "gulp": "^4.0.2",
        "gulp-sass": "^5.1.0",
        "sass": "^1.66.1"
    },
    "overrides": {
        "glob-parent": "6.0.2"
    }
}```