Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Удаленная работа для IT-специалистов
package.json
.browserslistrc
const gulp = require('gulp'); const sass = require('gulp-sass'); const concat = require('gulp-concat') const autoprefixer = require('gulp-autoprefixer'); const cleanCSS = require('gulp-clean-css'); const browserSync = require('browser-sync').create(); const sourcemaps = require('gulp-sourcemaps'); const gcmq = require('gulp-group-css-media-queries'); const imagemin = require('gulp-imagemin'); const webp = require('gulp-webp'); const svgstore = require('gulp-svgstore'); const config = { src: './src', css: { watch: '/precss/**/*.sass', src: '/precss/main.sass', dest: '/css' }, html: { src: '/*.html' }, js: { src: '/js/*.js' } }; gulp.task('build', function () { return gulp.src(config.src + config.css.src) .pipe(sourcemaps.init()) .pipe(sass().on('error', sass.logError)) .pipe(gcmq()) .pipe(autoprefixer()) // .pipe(cleanCSS({ // level: 2 // })) .pipe(sourcemaps.write('.')) .pipe(gulp.dest(config.src + config.css.dest)) .pipe(browserSync.reload({ stream: true })); }); gulp.task('js', function() { return gulp.src(config.src + config.js.src) .pipe(gulp.dest('./src/js/')) }); gulp.task('image-min', () => gulp.src('./src/img/**/*.{png, jpeg, svg}') .pipe(imagemin([ imagemin.gifsicle({interlaced: true}), imagemin.jpegtran({progressive: true}), imagemin.optipng({optimizationLevel: 3}), imagemin.svgo() ])) .pipe(gulp.dest('./src/img/')) ); gulp.task('webp', () => gulp.src('./src/img/**/*.{png, jpeg}') .pipe(webp({quality: 90})) .pipe(gulp.dest('./src/img/')) ); gulp.task('sprite', function () { return gulp .src('./src/img/icon-*.svg') .pipe(svgstore({ inlineSvg: true })) .pipe(rename('sprite.svg')) .pipe(gulp.dest('./src/img/')); }); gulp.task('watch', function () { gulp.watch(config.src + config.css.watch, gulp.parallel('build')); gulp.watch(config.src + config.js.src).on('change', browserSync.reload); gulp.watch(config.src + config.html.src).on('change', browserSync.reload); }); gulp.task('browserSync', function () { browserSync.init({ server: { baseDir: config.src } }); }); gulp.task('dist', function(){ return gulp.src([ './src/fonts/**/*.{woff,woff2}', './src/img/**', './src/js/**', './src/*html', './src/css/*.css' ], { base: './src' }) .pipe(gulp.dest('dist')) }); gulp.task('default', gulp.parallel('watch','browserSync', 'build', 'js'));