Обновить gulpfile.js
2 000 руб. за проект
Нужно переписать файл сборки стилей Gulpfile.js с учетом актуальных зависимостей (для Gulp v5 (обновить зависимости и файл
Gulpfile.js
/* eslint-disable */
require('es6-promise').polyfill()
const gulp = require('gulp'),
sass = require('gulp-sass')(require('sass'))
rtlcss = require('gulp-rtlcss'),
autoprefixer = require('gulp-autoprefixer'),
plumber = require('gulp-plumber'),
gutil = require('gulp-util'),
rename = require('gulp-rename'),
concat = require('gulp-concat'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
ts = require('gulp-typescript'),
tsProject = ts.createProject('tsconfig.json'),
browserSync = require('browser-sync').create(),
reload = browserSync.reload
const onError = ( err ) => {
console.log('An error occurred:', gutil.colors.magenta(err.message))
gutil.beep()
this.emit('end')
}
// JavaScript
gulp.task( 'js', () => {
return gulp.src(['./js/*.js'])
.pipe(rename({suffix: '.min'}))
.pipe(uglify({ output: { quote_style: 3 } }))
.pipe(gulp.dest('./js/build'))
})
// TypeScript
gulp.task( 'ts', () => {
return tsProject.src()
.pipe(tsProject())
.js
.pipe(uglify({ output: { quote_style: 3 } }))
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest("./js/build"))
})
// Sass
gulp.task('sass', gulp.series((done) => {
gulp.src('./sass/style.scss')
.pipe(plumber({ errorHandler: onError }))
.pipe(sass({outputStyle: 'compressed'}))
.pipe(autoprefixer())
.pipe(gulp.dest('./'))
gulp.src('./sass/pages/*.scss')
.pipe(plumber({ errorHandler: onError }))
.pipe(rename({suffix: '.min'}))
.pipe(sass({outputStyle: 'compressed'}))
.pipe(autoprefixer())
.pipe(gulp.dest('./sass/build/'))
.pipe(browserSync.stream())
done()
}))
// Watch
gulp.task('watch', gulp.series((done) => {
browserSync.init({
files: ['./**/*.php'],
proxy: 'doctorm.loc',
})
gulp.watch(['./**/*.scss']).on('change', gulp.series('sass', reload))
gulp.watch(['./js/*.js']).on('change', gulp.series('js', reload))
gulp.watch(['./js/*.ts']).on('change', gulp.series('ts', reload))
done()
}))
gulp.task('default', gulp.series('sass', 'js', 'ts', 'watch'))
/* eslint-enable */
Зависимости
"dependencies": {
"gulp-typescript": "^6.0.0-alpha.1",
"html-webpack-plugin": "^5.5.0",
"node-sass": "^7.0.1",
"rtlcss": "^3.5.0",
"typescript": "^4.6.3",
"browser-sync": "^2.29.1",
"es6-promise": "^4.2.8",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^8.0.0",
"gulp-concat": "^2.6.1",
"gulp-jshint": "^2.1.0",
"gulp-plumber": "^1.2.1",
"gulp-rename": "^2.0.0",
"gulp-rtlcss": "^2.0.0",
"gulp-sass": "^5.1.0",
"gulp-uglify": "^3.0.2",
"gulp-util": "^3.0.8"
}
Gulpfile.js
/* eslint-disable */
require('es6-promise').polyfill()
const gulp = require('gulp'),
sass = require('gulp-sass')(require('sass'))
rtlcss = require('gulp-rtlcss'),
autoprefixer = require('gulp-autoprefixer'),
plumber = require('gulp-plumber'),
gutil = require('gulp-util'),
rename = require('gulp-rename'),
concat = require('gulp-concat'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
ts = require('gulp-typescript'),
tsProject = ts.createProject('tsconfig.json'),
browserSync = require('browser-sync').create(),
reload = browserSync.reload
const onError = ( err ) => {
console.log('An error occurred:', gutil.colors.magenta(err.message))
gutil.beep()
this.emit('end')
}
// JavaScript
gulp.task( 'js', () => {
return gulp.src(['./js/*.js'])
.pipe(rename({suffix: '.min'}))
.pipe(uglify({ output: { quote_style: 3 } }))
.pipe(gulp.dest('./js/build'))
})
// TypeScript
gulp.task( 'ts', () => {
return tsProject.src()
.pipe(tsProject())
.js
.pipe(uglify({ output: { quote_style: 3 } }))
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest("./js/build"))
})
// Sass
gulp.task('sass', gulp.series((done) => {
gulp.src('./sass/style.scss')
.pipe(plumber({ errorHandler: onError }))
.pipe(sass({outputStyle: 'compressed'}))
.pipe(autoprefixer())
.pipe(gulp.dest('./'))
gulp.src('./sass/pages/*.scss')
.pipe(plumber({ errorHandler: onError }))
.pipe(rename({suffix: '.min'}))
.pipe(sass({outputStyle: 'compressed'}))
.pipe(autoprefixer())
.pipe(gulp.dest('./sass/build/'))
.pipe(browserSync.stream())
done()
}))
// Watch
gulp.task('watch', gulp.series((done) => {
browserSync.init({
files: ['./**/*.php'],
proxy: 'doctorm.loc',
})
gulp.watch(['./**/*.scss']).on('change', gulp.series('sass', reload))
gulp.watch(['./js/*.js']).on('change', gulp.series('js', reload))
gulp.watch(['./js/*.ts']).on('change', gulp.series('ts', reload))
done()
}))
gulp.task('default', gulp.series('sass', 'js', 'ts', 'watch'))
/* eslint-enable */
Зависимости
"dependencies": {
"gulp-typescript": "^6.0.0-alpha.1",
"html-webpack-plugin": "^5.5.0",
"node-sass": "^7.0.1",
"rtlcss": "^3.5.0",
"typescript": "^4.6.3",
"browser-sync": "^2.29.1",
"es6-promise": "^4.2.8",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^8.0.0",
"gulp-concat": "^2.6.1",
"gulp-jshint": "^2.1.0",
"gulp-plumber": "^1.2.1",
"gulp-rename": "^2.0.0",
"gulp-rtlcss": "^2.0.0",
"gulp-sass": "^5.1.0",
"gulp-uglify": "^3.0.2",
"gulp-util": "^3.0.8"
}
Отзывы
Большое спасибо, задача была выполнена почти моментально и без ошибок. Рекомендую специалиста!
8 месяцев
назад
В заказе есть исполнитель
При переводе заказа из архивного в актуальный, текущий исполнитель будет снят с задачи.
Выберите тип сделки
С безопасной сделкой вы всегда сможете вернуть средства, если что-то пойдет не так. С простой сделкой вы самостоятельно договариваетесь с исполнителем об оплате и берете на себя решение конфликтов.