gulp config

const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const ts = require('gulp-typescript');
const postcss = require('gulp-postcss');
const tailwindcss = require('tailwindcss');
const autoprefixer = require('autoprefixer');
const terser = require('gulp-terser');
const cleanCSS = require('gulp-clean-css');

//* copy html
gulp.task('html', () => {
  return gulp.src('./*.html').pipe(gulp.dest('./dist'));
});
gulp.task('watch:html', () => {
  gulp.watch('./*.html', gulp.series('html'));
});

//* copy font
gulp.task('font', () => {
  return gulp
    .src('./assets/font/*.woff2')
    .pipe(gulp.dest('./dist/assets/font'));
});
gulp.task('watch:font', () => {
  gulp.watch('./assets/font/*.woff2', gulp.series('font'));
});

// * compress image
gulp.task('img', () => {
  return import('gulp-imagemin').then(function (imagemin) {
    return gulp
      .src('./assets/img/**/*')
      .pipe(imagemin.default())
      .pipe(gulp.dest('./dist/assets/img'));
  });
});
gulp.task('watch:img', () => {
  gulp.watch('./assets/img/**/*', gulp.series('img'));
});

// * compress icon
gulp.task('icon', () => {
  return import('gulp-imagemin').then(function (imagemin) {
    return gulp
      .src('./assets/icon/**/*')
      .pipe(imagemin.default())
      .pipe(gulp.dest('./dist/assets/icon'));
  });
});
gulp.task('watch:icon', () => {
  gulp.watch('./assets/icon/**/*', gulp.series('icon'));
});

//* compile typescript
const tsProject = ts.createProject('tsconfig.json');
gulp.task('typescript', () => {
  return tsProject
    .src()
    .pipe(tsProject())
    .js.pipe(terser())
    .pipe(gulp.dest('./dist/assets/js'));
});
gulp.task('watch:typescript', () => {
  gulp.watch('./assets/ts/**/*.ts', gulp.series('typescript'));
});

//* compile sass
gulp.task('sass', () => {
  return gulp
    .src('./assets/scss/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(postcss([autoprefixer()]))
    .pipe(cleanCSS())
    .pipe(gulp.dest('./dist/assets/css'));
});
gulp.task('watch:sass', () => {
  gulp.watch('./assets/scss/**/*.scss', gulp.series('sass'));
});

//* compile tailwind
gulp.task('tailwind', () => {
  return gulp
    .src('./assets/css/global/tailwind.css')
    .pipe(postcss([tailwindcss()]))
    .pipe(cleanCSS())
    .pipe(gulp.dest('./dist/assets/css/global'));
});
gulp.task('watch:tailwind', () => {
  gulp.watch('./assets/css/global/tailwind.css', gulp.series('tailwind'));
});

//* run tasks
gulp.task(
  'default',
  gulp.parallel(
    'html',
    'font',
    'img',
    'icon',
    'typescript',
    'sass',
    'tailwind',
    'watch:html',
    'watch:font',
    'watch:img',
    'watch:icon',
    'watch:typescript',
    'watch:sass',
    'watch:tailwind',
  ),
);