95 lines
2.5 KiB
JavaScript
95 lines
2.5 KiB
JavaScript
import gulp from 'gulp';
|
|
import config from '../config';
|
|
import sass from 'gulp-sass';
|
|
import plumber from 'gulp-plumber';
|
|
import gulpif from 'gulp-if';
|
|
import size from 'gulp-size';
|
|
import stylelint from 'stylelint';
|
|
import postcss from 'gulp-postcss';
|
|
import syntaxScss from 'postcss-scss';
|
|
import reporter from 'postcss-reporter';
|
|
import notify from 'gulp-notify';
|
|
import notifier from 'node-notifier';
|
|
import header from 'gulp-header';
|
|
import minify from 'gulp-clean-css';
|
|
import rename from 'gulp-rename';
|
|
import del from 'del';
|
|
|
|
// STYLES
|
|
// ------------------
|
|
// lints styles using stylelint (config under 'stylelint' in package.json)
|
|
gulp.task('lint:styles', () => {
|
|
return gulp
|
|
.src([`${config.styles.source}/**/*.scss`, `!${config.styles.source}/bootstrap/**/*.scss`, `!${config.styles.source}/mixins/**/*.scss`], {
|
|
base: './',
|
|
since: gulp.lastRun('lint:styles'),
|
|
})
|
|
.pipe(
|
|
postcss(
|
|
[
|
|
stylelint({
|
|
fix: true,
|
|
syntax: 'scss',
|
|
}), // see http://stylelint.io/user-guide/example-config/
|
|
reporter({clearMessages: true, clearReportedMessages: true}),
|
|
],
|
|
{syntax: syntaxScss}
|
|
)
|
|
)
|
|
.pipe(gulp.dest('./'));
|
|
});
|
|
|
|
// Compiles sass into css & minifies it (production)
|
|
gulp.task('make:styles', () => {
|
|
return gulp
|
|
.src(`${config.styles.source}/*.scss`)
|
|
.pipe(
|
|
plumber({errorHandler: notify.onError('Error: <%= error.message %>')})
|
|
)
|
|
.pipe(
|
|
sass({
|
|
precision: 10, // https://github.com/sass/sass/issues/1122
|
|
includePaths: config.styles.include,
|
|
})
|
|
)
|
|
.pipe(postcss())
|
|
.pipe(gulpif(config.production, header(config.banner)))
|
|
.pipe(size({gzip: true, showFiles: true}))
|
|
.pipe(gulp.dest(`${config.styles.build}`))
|
|
.pipe(minify())
|
|
.pipe(rename({
|
|
extname: '.min.css'
|
|
}))
|
|
.pipe(size({gzip: true, showFiles: true}))
|
|
.pipe(plumber.stop())
|
|
.pipe(gulp.dest(`${config.styles.build}`));
|
|
});
|
|
|
|
gulp.task(
|
|
'styles',
|
|
gulp.series('lint:styles', 'make:styles', (done) => {
|
|
if (config.enable.notify) {
|
|
notifier.notify({
|
|
title: config.notify.title,
|
|
message: 'Styles task complete',
|
|
});
|
|
}
|
|
|
|
done();
|
|
})
|
|
);
|
|
|
|
// Clean styles files
|
|
gulp.task('clean:styles', (done) => {
|
|
return del([`${config.styles.build}/**/*`]).then(() => {
|
|
if (config.enable.notify) {
|
|
notifier.notify({
|
|
title: config.notify.title,
|
|
message: 'Clean styles task complete',
|
|
});
|
|
}
|
|
|
|
done();
|
|
});
|
|
});
|