gulpfile.js - main - topboy/Gulp-template

gulpfile.js
137 строк4 KB
Sergey Kolmakov
рефактор и оптимизация
22 янв 2026, 08:03
22 янв 2026, 08:0386414a6
const { src, dest, watch, parallel, series } = require('gulp');

const scss = require('gulp-sass')(require('sass'));
const concat = require('gulp-concat');
const imagemin = require('gulp-imagemin');
const rename = require('gulp-rename');
const nunjucksRender = require('gulp-nunjucks-render');
const uglify = require('gulp-uglify-es').default;
const browserSync = require('browser-sync').create();
const autoprefixer = require('gulp-autoprefixer');
const clean = require('gulp-clean');
const fs = require('fs');
const path = require('path');
const DATA_DIR = 'app/data';


function nunjucks() {
  return src('app/*.njk')
    .pipe(nunjucksRender({
      path: ['app/templates/'],
      manageEnv: function (env) {
        /// Кэш для JSON-файлов
        const jsonCache = {};

        function loadJson(filename) {
          // Запрещаем пути с ".." или "/"
          if (filename.includes('..') || path.isAbsolute(filename)) {
            throw new Error(`Запрещённый путь: ${filename}`);
          }

          const filePath = path.join(DATA_DIR, `${filename}.json`);
          if (!fs.existsSync(filePath)) {
            throw new Error(`Файл не найден: ${filename}.json`);
          }

          if (!jsonCache[filePath]) {
            jsonCache[filePath] = JSON.parse(fs.readFileSync(filePath, 'utf8'));
          }
          return jsonCache[filePath];
        }

        // В manageEnv:
        env.addGlobal('import_json', loadJson);
      }
    }))
    .pipe(dest('dist'))
    .pipe(browserSync.stream())
}


function scripts() {
  return src([
    'app/js/main.js',
    'node_modules/jquery/dist/jquery.js',

  ])
    .pipe(concat('main.min.js'))
    .pipe(uglify())
    .pipe(dest('dist/js'))
    .pipe(browserSync.stream());
}

function styles() {
  return src('app/scss/style.scss')
    .pipe(autoprefixer({ overrideBrowserslist: ['last 5 versions'], grid: true }))
    // .pipe(concat('style.min.css'))
    .pipe(rename({
      suffix: '.min'
    }))
    .pipe(scss({
      outputStyle: 'compressed',
      includePaths: ['app/scss']
    }).on('error', scss.logError))
    .pipe(dest('dist/css'))
    .pipe(browserSync.stream());
}

function images() {
  return src('app/images/**/*.{jpg,jpeg,png,gif,webp,svg,avif}', {
    encoding: false
  })
    .pipe(imagemin(
      [
        imagemin.gifsicle({ interlaced: true }),
        imagemin.mozjpeg({ quality: 75, progressive: true }),
        imagemin.optipng({ optimizationLevel: 5 }),
        imagemin.svgo({
          plugins: [
            { removeViewBox: true },
            { cleanupIDs: false }
          ]
        })
      ]
    ))
    .pipe(dest('dist/images'))
}

function copyImages() {
  return src('app/images/**/*.{jpg,jpeg,png,gif,webp,svg}', {
    encoding: false // Это критически важно для Gulp 5
  })
    .pipe(dest('dist/images'));
}


function watching() {
  watch(['app/scss/**/*.scss'], styles);
  watch(['app/**/*.njk', 'app/templates/**/*.njk', 'app/data/**/*.json'], nunjucks);
  watch(['app/js/**/*.js', '!app/js/main.min.js'], scripts);
  watch(['app/*.html', 'app/data/**/*.json']).on('change', browserSync.reload);
}

function browser() {
  browserSync.init({
    server: {
      baseDir: "dist/"
    },
    notify: false
  });
}

function cleanDist() {
  return src('dist')
    .pipe(clean());
}

exports.styles = styles;
exports.scripts = scripts;
exports.watching = watching;
exports.images = images;
exports.copyImages = copyImages;
exports.nunjucks = nunjucks;
exports.cleanDist = cleanDist;
exports.browser = browser;

exports.default = parallel(nunjucks, styles, scripts, copyImages, browser, watching);
exports.clean = cleanDist;