12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394 |
- 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();
- });
- });
|