diff options
Diffstat (limited to 'gulpfile.js')
-rw-r--r-- | gulpfile.js | 166 |
1 files changed, 166 insertions, 0 deletions
diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..fc8533e --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,166 @@ +'use strict'; + +/* paths to source files (src), to ready files (build), as well as to those whose changes need to be monitored (watch) */ +var path = { + build: { + html: 'assets/build/', + js: 'assets/build/js/', + wasm: 'assets/build/js', + css: 'assets/build/css/', + img: 'assets/build/img/', + fonts: 'assets/build/fonts/' + }, + src: { + html: 'assets/src/*.html', + js: 'assets/src/js/*.js', + style: 'assets/src/style/main.scss', + img: 'assets/src/img/**/*.*', + fonts: 'assets/src/fonts/**/*.*', + wasm: 'assets/src/js/*.wasm' + }, + watch: { + html: 'assets/src/**/*.html', + js: 'assets/src/js/**/*.js', + css: 'assets/src/style/**/*.scss', + img: 'assets/src/img/**/*.*', + fonts: 'assets/srs/fonts/**/*.*' + }, + clean: './assets/build/*' +}; + +/* настройки сервера */ +var config = { + server: { + baseDir: './assets/build' + }, + notify: false +}; + +/* include gulp and plugins */ +var gulp = require('gulp'), // include Gulp + webserver = require('browser-sync'), // server for work and automatic page updates + plumber = require('gulp-plumber'), // bug tracking module + rigger = require('gulp-rigger'), // a module to import the contents of one file into another + sourcemaps = require('gulp-sourcemaps'), // module for generating a map of source files + sass = require('gulp-sass'), // module for compiling SASS (SCSS) to CSS + autoprefixer = require('gulp-autoprefixer'), // module for automatic installation of auto-prefixes + cleanCSS = require('gulp-clean-css'), // CSS minification plugin + uglify = require('gulp-uglify'), // JavaScript minification module + cache = require('gulp-cache'), // module for caching + imagemin = require('gulp-imagemin'), // plugin for compressing PNG, JPEG, GIF and SVG images + jpegrecompress = require('imagemin-jpeg-recompress'), // jpeg compression plugin + pngquant = require('imagemin-pngquant'), // png compression plugin + del = require('del'), // plugin for deleting files and directories + rename = require('gulp-rename'); + +/* tasks */ + +// start the server +gulp.task('webserver', function () { + webserver(config); +}); + +// compile html +gulp.task('html:build', function () { + return gulp.src(path.src.html) // selection of all html files in the specified path + .pipe(plumber()) // error tracking + .pipe(rigger()) // attachment import + .pipe(gulp.dest(path.build.html)) // uploading ready files + .pipe(webserver.reload({ stream: true })); // server reboot +}); + +// compile styles +gulp.task('css:build', function () { + return gulp.src(path.src.style) // get main.scss + .pipe(plumber()) // for bug tracking + .pipe(sourcemaps.init()) // initialize sourcemap + .pipe(sass()) // scss -> css + .pipe(autoprefixer()) // add prefix + .pipe(gulp.dest(path.build.css)) + .pipe(rename({ suffix: '.min' })) + .pipe(cleanCSS()) // minimize CSS + .pipe(sourcemaps.write('./')) // write sourcemap + .pipe(gulp.dest(path.build.css)) // output to build + .pipe(webserver.reload({ stream: true })); // server restart +}); + +// compile js +gulp.task('js:build', function () { + return gulp.src(path.src.js) // get file main.js + .pipe(plumber()) // for bug tracking + .pipe(rigger()) // import all files to main.js + .pipe(gulp.dest(path.build.js)) + .pipe(rename({ suffix: '.min' })) + .pipe(sourcemaps.init()) //initialize sourcemap + .pipe(uglify()) // minimize js + .pipe(sourcemaps.write('./')) // write sourcemap + .pipe(gulp.dest(path.build.js)) // put ready file + .pipe(webserver.reload({ stream: true })); // server restart +}); + +gulp.task('wasm:build', function () { + return gulp.src(path.src.wasm) + .pipe(gulp.dest(path.build.wasm)) + .pipe(webserver.reload({stream: true})) +}); + +// move fonts +gulp.task('fonts:build', function () { + return gulp.src(path.src.fonts) + .pipe(gulp.dest(path.build.fonts)); +}); + +// image processing +gulp.task('image:build', function () { + return gulp.src(path.src.img) // path to image source + .pipe(cache(imagemin([ // image compression + imagemin.gifsicle({ interlaced: true }), + jpegrecompress({ + progressive: true, + max: 90, + min: 80 + }), + pngquant(), + imagemin.svgo({ plugins: [{ removeViewBox: false }] }) + ]))) + .pipe(gulp.dest(path.build.img)); // output ready files +}); + +// remove catalog build +gulp.task('clean:build', function () { + return del(path.clean); +}); + +// clear cache +gulp.task('cache:clear', function () { + cache.clearAll(); +}); + +// assembly +gulp.task('build', + gulp.series('clean:build', + gulp.parallel( + 'html:build', + 'css:build', + 'js:build', + 'fonts:build', + 'image:build', + 'wasm:build' + ) + ) +); + +// launching tasks when files change +gulp.task('watch', function () { + gulp.watch(path.watch.html, gulp.series('html:build')); + gulp.watch(path.watch.css, gulp.series('css:build')); + gulp.watch(path.watch.js, gulp.series('js:build')); + gulp.watch(path.watch.img, gulp.series('image:build')); + gulp.watch(path.watch.fonts, gulp.series('fonts:build')); +}); + +// default tasks +gulp.task('default', gulp.series( + 'build', + gulp.parallel('webserver','watch') +)); |