1
0
mirror of https://github.com/kognise/water.css.git synced 2025-08-09 06:37:05 +02:00

More logging of file sizes, saner browserlist

This commit is contained in:
Kyle Pollard
2019-04-07 20:52:18 -07:00
parent 5e06e92b2e
commit 45b1b26b7e
2 changed files with 36 additions and 8 deletions

View File

@@ -6,6 +6,7 @@ const cssnano = require('cssnano')
const sourcemaps = require('gulp-sourcemaps') const sourcemaps = require('gulp-sourcemaps')
const bytediff = require('gulp-bytediff') const bytediff = require('gulp-bytediff')
const browserSync = require('browser-sync').create() const browserSync = require('browser-sync').create()
const chalk = require('chalk');
const paths = { const paths = {
styles: { styles: {
@@ -17,6 +18,29 @@ const paths = {
} }
} }
// https://stackoverflow.com/a/20732091
function humanFileSize(size) {
var i = Math.floor( Math.log(size) / Math.log(1024) );
return ( size / Math.pow(1024, i) ).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
};
function formatByteMessage(source, data){
var change = (data.savings > 0 ? 'saved' : 'gained');
var prettySavings = humanFileSize(Math.abs(data.savings));
var prettyStartSize = humanFileSize(data.startSize);
var prettyEndSize = humanFileSize(data.endSize);
if(data.endSize > data.startSize){
prettyEndSize = chalk.yellow(prettyEndSize);
}
if(data.endSize < data.startSize){
prettyEndSize = chalk.green(prettyEndSize);
}
return `${chalk.cyan(source.padStart(12, ' '))}: ${data.fileName} ${change} ${prettySavings} (${prettyStartSize} -> ${prettyEndSize})`
}
function style() { function style() {
return ( return (
gulp.src(paths.styles.src) gulp.src(paths.styles.src)
@@ -24,8 +48,11 @@ function style() {
.pipe(sass()) .pipe(sass())
.on('error', sass.logError) .on('error', sass.logError)
.pipe(bytediff.start()) .pipe(bytediff.start())
.pipe(postcss([ autoprefixer(), cssnano() ])) .pipe(postcss([ autoprefixer()]))
.pipe(bytediff.stop()) .pipe(bytediff.stop((data) => formatByteMessage("autoprefixer", data)))
.pipe(bytediff.start())
.pipe(postcss([cssnano()]))
.pipe(bytediff.stop((data) => formatByteMessage("cssnano", data)))
.pipe(sourcemaps.write('.')) .pipe(sourcemaps.write('.'))
.pipe(gulp.dest(paths.styles.dest)) .pipe(gulp.dest(paths.styles.dest))
.pipe(browserSync.stream()) .pipe(browserSync.stream())

View File

@@ -28,14 +28,15 @@
"browser-sync": "^2.26.3", "browser-sync": "^2.26.3",
"cssnano": "^4.1.10", "cssnano": "^4.1.10",
"gulp": "^4.0.0", "gulp": "^4.0.0",
"gulp-bytediff": "^1.0.0",
"gulp-postcss": "^8.0.0", "gulp-postcss": "^8.0.0",
"gulp-sass": "^4.0.2", "gulp-sass": "^4.0.2",
"gulp-sourcemaps": "^2.6.5", "gulp-sourcemaps": "^2.6.5"
"gulp-bytediff": "^1.0.0"
}, },
"browserslist": [ "browserslist": [
"last 1 version", "defaults AND not android 4.4.3"
"not dead", ],
"> 5%" "dependencies": {
] "chalk": "^2.4.2"
}
} }