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:
31
gulpfile.js
31
gulpfile.js
@@ -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())
|
||||||
|
13
package.json
13
package.json
@@ -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"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user