112 lines
2.6 KiB
JavaScript
112 lines
2.6 KiB
JavaScript
var gulp = require('gulp');
|
|
var browserSync = require('browser-sync');
|
|
var sass = require('gulp-sass');
|
|
var rename = require('gulp-rename');
|
|
var autoprefixer = require('gulp-autoprefixer');
|
|
var sourcemaps = require('gulp-sourcemaps');
|
|
var headerComment = require('gulp-header-comment');
|
|
var gulpStylelint = require('gulp-stylelint');
|
|
var stylefmt = require('gulp-stylefmt');
|
|
let cleanCSS = require('gulp-clean-css');
|
|
var gulpSequence = require('gulp-sequence')
|
|
var del = require('del');
|
|
var reload = browserSync.reload;
|
|
|
|
module.exports = gulp;
|
|
|
|
/* BROWSER SYNC */
|
|
gulp.task('browser-sync', function () {
|
|
browserSync({
|
|
port: 3040,
|
|
server: {
|
|
baseDir: "./",
|
|
directory: true
|
|
},
|
|
https: true
|
|
});
|
|
});
|
|
|
|
/* BROWSER SYNC RELOAD */
|
|
gulp.task('browser-sync-reload', function () {
|
|
browserSync.reload();
|
|
});
|
|
|
|
/* LIST SCSS */
|
|
gulp.task('lint:scss', function () {
|
|
return gulp
|
|
.src('src/**/*.scss')
|
|
.pipe(gulpStylelint({
|
|
reporters: [{
|
|
formatter: 'string',
|
|
console: true
|
|
}]
|
|
}));
|
|
});
|
|
|
|
/* COMPILE SCSS */
|
|
gulp.task('compile:scss', function () {
|
|
return gulp.src('src/**/*.scss')
|
|
.pipe(sourcemaps.init())
|
|
.pipe(sass({
|
|
outputStyle: 'expanded'
|
|
})
|
|
.on('error', sass.logError))
|
|
.pipe(autoprefixer({
|
|
browsers: ['> 5%', 'last 4 versions'],
|
|
cascade: false
|
|
}))
|
|
.pipe(sourcemaps.write('./maps'))
|
|
.pipe(gulp.dest('dist'))
|
|
.pipe(browserSync.reload({
|
|
stream: true
|
|
}));
|
|
});
|
|
|
|
/* FORMAT CSS */
|
|
gulp.task('format:css', function () {
|
|
return gulp.src('dist/*.css')
|
|
.pipe(stylefmt())
|
|
.pipe(gulp.dest('dist'));
|
|
})
|
|
|
|
/* CLEAN DIST */
|
|
gulp.task('clean:dist', function () {
|
|
return del(['dist']);
|
|
});
|
|
|
|
/* MINIFY CSS */
|
|
gulp.task('minify:css', () => {
|
|
return gulp.src('dist/*.css')
|
|
.pipe(cleanCSS({
|
|
compatibility: 'ie9'
|
|
}))
|
|
.pipe(rename({
|
|
suffix: '.min'
|
|
}))
|
|
.pipe(gulp.dest('dist'));
|
|
});
|
|
|
|
/* SET HEADER */
|
|
gulp.task('set:header', function () {
|
|
return gulp.src('dist/*.css')
|
|
.pipe(headerComment(`
|
|
pretty-checkbox.css
|
|
|
|
A pure CSS library to beautify checkbox and radio buttons
|
|
|
|
Source: <%= pkg.repository.link %>
|
|
Demo: <%= pkg.homepage %>
|
|
|
|
Copyright (c) <%= moment().format('YYYY') %> <%= _.capitalize(pkg.author) %>
|
|
`))
|
|
.pipe(gulp.dest('dist'))
|
|
});
|
|
|
|
gulp.task('build', function (cb) {
|
|
gulpSequence('lint:scss', 'clean:dist', 'compile:scss', 'format:css', 'minify:css', 'set:header', cb)
|
|
});
|
|
|
|
gulp.task('default', ['compile:scss', 'browser-sync'], function () {
|
|
gulp.watch("src/**/*.scss", ['compile:scss', 'browser-sync-reload']);
|
|
});
|