Merge branch 'update'

.babelrc

@@ -1,10 +1,7 @@
 {
   "presets": [
     [
-      "@babel/preset-env",
-      {
-        "useBuiltIns": "entry"
-      }
+      "@babel/preset-env"
     ]
   ]
 }

.eslintrc.json

@@ -10,9 +10,23 @@
     "sourceType": "module"
   },
   "rules": {
-    "indent": ["error", 2],
-    "linebreak-style": ["error", "unix"],
-    "quotes": ["error", "single"],
-    "semi": ["error", "always"]
+    "indent": [
+      "error",
+      2,
+      {"SwitchCase": 1
+      }
+    ],
+    "linebreak-style": [
+      "error",
+      "unix"
+    ],
+    "quotes": [
+      "error",
+      "single"
+    ],
+    "semi": [
+      "error",
+      "always"
+    ]
   }
 }

.gitignore

@@ -1,12 +1,13 @@
-.DS_Store
-.idea
 *.ai
 *.log
 *.pdf
 *.psd
 *.sublime*
+npm-debug.*
+Thumbs.db
+.DS_Store
+.idea
+layouts
 build
 dist
 node_modules
-npm-debug.*
-Thumbs.db

gulpfile.js/index.js

@@ -8,7 +8,7 @@ task(
   'build',
   series(
     'clean',
-    parallel('fonts', 'copy', 'pages', 'styles', 'scripts', 'images', 'icons')
+    parallel('fonts', 'copy', 'pages', 'styles', 'scripts', 'images', 'webp', 'icons')
   )
 );
 

gulpfile.js/settings.js

@@ -13,7 +13,8 @@ module.exports = {
       scripts: dirs.src + 'js/',
       images: {
         all: dirs.src + 'img/',
-        icons: dirs.src + 'img/icons/'
+        icons: dirs.src + 'img/icons/',
+        content: dirs.src + 'img/content/'
       },
       fonts: dirs.src + 'fonts/'
     },
@@ -22,7 +23,8 @@ module.exports = {
       styles: dirs.dest + 'css/',
       scripts: dirs.dest + 'js/',
       images: {
-        all: dirs.dest + 'img/'
+        all: dirs.dest + 'img/',
+        content: dirs.dest + 'img/content/'
       },
       fonts: dirs.dest + 'fonts/'
     },

gulpfile.js/tasks/clean.js

@@ -5,6 +5,4 @@ const { task } = require('gulp');
 const del = require('del');
 
 // Удаление каталога сборки
-task('clean', function() {
-  return del(settings.paths.dest.root);
-});
+task('clean', () => del(settings.paths.dest.root));

gulpfile.js/tasks/copy.js

@@ -4,6 +4,6 @@ const settings = require('../settings');
 const { task, src, dest } = require('gulp');
 
 // Копирование вендорных JS файлов
-task('copy', function() {
-  return src(settings.vendor.scripts).pipe(dest(settings.paths.dest.scripts));
-});
+task('copy', () =>
+  src(settings.vendor.scripts).pipe(dest(settings.paths.dest.scripts))
+);

gulpfile.js/tasks/fonts.js

@@ -5,8 +5,8 @@ const { task, src, dest } = require('gulp');
 const changed = require('gulp-changed');
 
 // Копирование шрифтов
-task('fonts', function () {
-  return src(`${settings.paths.src.fonts}**/*.{woff,woff2}`)
+task('fonts', () =>
+  src(`${settings.paths.src.fonts}**/*.{woff,woff2}`)
     .pipe(changed(settings.paths.dest.fonts))
-    .pipe(dest(settings.paths.dest.fonts));
-});
+    .pipe(dest(settings.paths.dest.fonts))
+);

gulpfile.js/tasks/icons.js

@@ -10,7 +10,7 @@ const svgstore = require('gulp-svgstore');
 const isProd = !!process.env.NODE_ENV;
 
 // Сборка SVG спрайта
-task('icons', function() {
+task('icons', () => {
   let pluginsSvgo = [
     { removeViewBox: false },
     { removeTitle: true },

gulpfile.js/tasks/images.js

@@ -10,7 +10,7 @@ const imageminJpegoptim = require('imagemin-jpegoptim');
 const isProd = !!process.env.NODE_ENV;
 
 // Оптимизация изображений
-task('images', function() {
+task('images', () => {
   let pluginsSvgo = [
     { removeViewBox: false },
     { removeTitle: true },

gulpfile.js/tasks/lintspaces.js

@@ -5,8 +5,8 @@ const { task, src } = require('gulp');
 const lintspaces = require('gulp-lintspaces');
 
 // Линтинг в соответствии с настройками .editorconfig
-task('lintspaces', function() {
-  return src([
+task('lintspaces', () =>
+  src([
     '*.json',
     '*.md',
     './gulpfile.js/**/*.js',
@@ -16,5 +16,5 @@ task('lintspaces', function() {
     `${settings.paths.src.styles}**/*.less`
   ])
     .pipe(lintspaces({ editorconfig: '.editorconfig' }))
-    .pipe(lintspaces.reporter());
-});
+    .pipe(lintspaces.reporter())
+);

gulpfile.js/tasks/pages.js

@@ -6,7 +6,7 @@ const changed = require('gulp-changed');
 const htmlmin = require('gulp-htmlmin');
 
 // Минификация HTML
-task('pages', function() {
+task('pages', () => {
   let optionsHtmlmin = {
     collapseInlineTagWhitespace: true,
     collapseWhitespace: true,

gulpfile.js/tasks/scripts.js

@@ -12,13 +12,13 @@ const uglify = require('gulp-uglify');
 const isDev = !process.env.NODE_ENV;
 
 // Минификация JS файлов
-task('scripts', function() {
-  return src(`${settings.paths.src.scripts}**/*.js`)
+task('scripts', () =>
+  src(`${settings.paths.src.scripts}**/*.js`)
     .pipe(gulpIf(isDev, sourcemaps.init()))
     .pipe(babel())
     .pipe(concat('index.js'))
     .pipe(uglify())
     .pipe(gulpIf(isDev, sourcemaps.write()))
     .pipe(rename({ suffix: '.min' }))
-    .pipe(dest(settings.paths.dest.scripts));
-});
+    .pipe(dest(settings.paths.dest.scripts))
+);

gulpfile.js/tasks/server.js

@@ -5,7 +5,7 @@ const { task } = require('gulp');
 const browserSync = require('browser-sync').create('Local Server');
 
 // Локальный сервер
-task('server', function(done) {
+task('server', done => {
   browserSync.init({
     server: settings.paths.dest.root,
     cors: true,

gulpfile.js/tasks/styles.js

@@ -9,22 +9,21 @@ const sourcemaps = require('gulp-sourcemaps');
 const less = require('gulp-less');
 const postcss = require('gulp-postcss');
 const autoprefixer = require('autoprefixer');
-const mqpacker = require('css-mqpacker');
 const csso = require('gulp-csso');
 const browserSync = require('browser-sync').get('Local Server');
 
 const isDev = !process.env.NODE_ENV;
 
 // Компиляция стилей проекта
-task('styles', function() {
-  let pluginsPostcss = [autoprefixer(), mqpacker({ sort: true })];
+task('styles', () => {
+  let pluginsPostcss = [autoprefixer()];
 
   return src(`${settings.paths.src.styles}style.less`)
     .pipe(gulpIf(isDev, sourcemaps.init()))
     .pipe(plumber())
     .pipe(less())
     .pipe(postcss(pluginsPostcss))
-    .pipe(csso({ comments: false }))
+    .pipe(csso({ forceMediaMerge: true, comments: false }))
     .pipe(gulpIf(isDev, sourcemaps.write()))
     .pipe(rename({ suffix: '.min' }))
     .pipe(dest(settings.paths.dest.styles))

gulpfile.js/tasks/watch.js

@@ -4,7 +4,7 @@ const settings = require('../settings');
 const { task, series, watch } = require('gulp');
 const browserSync = require('browser-sync').get('Local Server');
 
-task('watch', function() {
+task('watch', () => {
   watch(`${settings.paths.src.root}*.html`).on(
     'all',
     series('pages', browserSync.reload)
@@ -26,4 +26,8 @@ task('watch', function() {
     'all',
     series('icons', browserSync.reload)
   );
+  watch(`${settings.paths.src.images.content}**/*.jpg`).on(
+    'all',
+    series('webp', browserSync.reload)
+  );
 });

gulpfile.js/tasks/webp.js

@@ -0,0 +1,14 @@
+'use strict';
+
+const settings = require('../settings');
+const { task, src, dest } = require('gulp');
+const changed = require('gulp-changed');
+const webp = require('gulp-webp');
+
+// Конвертация контентных изображений в формат WebP
+task('webp', () =>
+  src(`${settings.paths.src.images.content}**/*.jpg`)
+    .pipe(changed(settings.paths.dest.images.content, { extension: '.webp' }))
+    .pipe(webp({ quality: 80 }))
+    .pipe(dest(settings.paths.dest.images.content))
+);

gulpfile.js/tasks/zip.js

@@ -4,11 +4,9 @@ const settings = require('../settings');
 const { task, src, dest } = require('gulp');
 const zip = require('gulp-zip');
 
-const leadingZero = function(number) {
-  return number < 10 ? `0${number}` : number;
-};
+const leadingZero = number => number < 10 ? `0${number}` : number;
 
-const getDateTime = function() {
+const getDateTime = () => {
   const now = new Date();
   const year = now.getFullYear();
   const month = leadingZero(now.getMonth() + 1);
@@ -20,7 +18,7 @@ const getDateTime = function() {
   return `${year}-${month}-${day}-${hours}${minutes}${seconds}`;
 };
 
-task('zip', function() {
+task('zip', () => {
   let dateTime = getDateTime();
   let fileName = `dist-${dateTime}.zip`;