JSFiddle - React, Tailwind, and code Playground

JavaScript

//подключаем модули галпа
const gulp = require('gulp');
const concat = require('gulp-concat');
const autoprefixer = require('gulp-autoprefixer')
const sass = require('gulp-sass');
const cleanCSS = require('gulp-clean-css');
const uglify = require('gulp-uglify');

const cssFiles = [
	'app/css/main.scss',
	'app/css/media.scss'
]

const jsFiles = [
	'app/js/lib.js',
	'app/js/main.js'
]

// таск на стили css
function styles(){
		//Шаблон для поиска файлов CSS
		//Все файлы по шаблону 'app/css/**/.css'

	return gulp.src(cssFiles)
		.pipe(sass().on('error', sass.logError))
		//объединение файлов в один
		.pipe(concat('styles.css'))
		//добавить префиксы
		.pipe(autoprefixer({
			override: ['last 2 versions'],
			cascade: false
		}))
		.pipe(cleanCSS({
			level: 2
		}))
		//Выходная папка для стилей
		.pipe(gulp.dest('dist/css/'))
}

//таск на скрипты js
function scripts(){
		//Шаблон для поиска файлов CSS
		//Все файлы по шаблону 'app/css/**/.css'
	return gulp.src(jsFiles)
		//объединение файлов в один
		.pipe(concat('script.js'))
		.pipe(uglify({
			toplevel: true
		}))
		//выходня папка для стилей
		.pipe(gulp.dest('dist/js/'))
}

// таск вызывающий функцию styles
gulp.task('styles', styles);
//таск вызывающий функцию scripts
gulp.task('scripts', scripts);