Как в Gulp 4 минифицировать библиотеки?

В Gulp 4 для минификации библиотек можно использовать различные плагины. Один из самых популярных плагинов для минификации JavaScript кода - это "gulp-uglify". Для минификации CSS кода можно использовать плагин "gulp-cssnano".

Перед началом минификации следует установить нужные плагины, выполнив следующие команды в командной строке:

npm install gulp-uglify --save-dev
npm install gulp-cssnano --save-dev

После установки плагинов, создайте новый файл "gulpfile.js" в корневой папке вашего проекта (если его еще нет) и подключите Gulp и необходимые плагины:

const gulp = require('gulp');
const uglify = require('gulp-uglify');
const cssnano = require('gulp-cssnano');

Затем создайте задачу для минификации JavaScript кода:

gulp.task('minify-js', function() {
  return gulp.src('src/js/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'));
});

В данном примере мы указываем Gulp'у, чтобы он взял все файлы с расширением ".js" из папки "src/js", минифицировал их с помощью плагина "gulp-uglify" и сохранял результат в папке "dist/js". Вы можете изменить пути по необходимости.

Теперь создайте задачу для минификации CSS кода:

gulp.task('minify-css', function() {
  return gulp.src('src/css/*.css')
    .pipe(cssnano())
    .pipe(gulp.dest('dist/css'));
});

Аналогично предыдущей задаче, мы указываем Gulp'у взять все файлы с расширением ".css" из папки "src/css", минифицировать их с помощью плагина "gulp-cssnano" и сохранить результат в папке "dist/css".

Наконец, создайте задачу, которая будет запускать обе предыдущие задачи:

gulp.task('minify', gulp.parallel('minify-js', 'minify-css'));

Вы можете вызвать эту задачу, например, при выполнении команды "gulp minify" в командной строке, и Gulp выполнит минификацию всех JavaScript и CSS файлов в соответствующих папках.

Надеюсь, это подробное объяснение помогло вам понять, как минифицировать библиотеки в Gulp 4 с использованием соответствующих плагинов. Если у вас возникнут вопросы, не стесняйтесь задавать их.