clean-css
Advanced tools
Comparing version 5.1.5 to 5.2.0
/** | ||
* Clean-css - https://github.com/jakubpawlowicz/clean-css | ||
* Clean-css - https://github.com/clean-css/clean-css | ||
* Released under the terms of MIT license | ||
* | ||
* Copyright (C) 2017 JakubPawlowicz.com | ||
*/ | ||
@@ -106,3 +104,3 @@ | ||
outputAsHash = Object.assign(outputAsHash, output); | ||
errors.concat(innerErrors); | ||
errors = errors.concat(innerErrors); | ||
} | ||
@@ -117,3 +115,3 @@ | ||
outputAsHash[inputValue] = minify([inputValue], options); | ||
errors.concat(outputAsHash[inputValue].errors); | ||
errors = errors.concat(outputAsHash[inputValue].errors); | ||
} | ||
@@ -140,3 +138,3 @@ } | ||
outputAsHash[inputKey] = minify(inputValue.styles, options, inputValue.sourceMap); | ||
errors.concat(outputAsHash[inputKey].errors); | ||
errors = errors.concat(outputAsHash[inputKey].errors); | ||
} | ||
@@ -217,5 +215,4 @@ | ||
function optimize(tokens, context) { | ||
var optimized; | ||
var optimized = level0Optimize(tokens, context); | ||
optimized = level0Optimize(tokens, context); | ||
optimized = OptimizationLevel.One in context.options.level ? | ||
@@ -222,0 +219,0 @@ level1Optimize(tokens, context) : |
@@ -284,3 +284,2 @@ var InvalidPropertyError = require('../invalid-property-error'); | ||
var isWeightValid; | ||
var isSizeSet = false; | ||
var appendableFamilyName = false; | ||
@@ -342,3 +341,2 @@ | ||
size.value = [values[index]]; | ||
isSizeSet = true; | ||
index++; | ||
@@ -354,3 +352,3 @@ } else { | ||
// ... and perhaps line-height | ||
if (isSizeSet && values[index] && values[index][1] == Marker.FORWARD_SLASH && values[index + 1] && (validator.isLineHeightKeyword(values[index + 1][1]) || validator.isUnit(values[index + 1][1]) || validator.isNumber(values[index + 1][1]))) { | ||
if (values[index] && values[index][1] == Marker.FORWARD_SLASH && values[index + 1] && (validator.isLineHeightKeyword(values[index + 1][1]) || validator.isUnit(values[index + 1][1]) || validator.isNumber(values[index + 1][1]))) { | ||
height.value = [values[index + 1]]; | ||
@@ -357,0 +355,0 @@ index++; |
@@ -101,3 +101,3 @@ var shallowClone = require('../clone').shallow; | ||
function borderRadius(property, configuration) { | ||
function borderRadius(property) { | ||
if (property.multiplex) { | ||
@@ -122,4 +122,4 @@ var horizontal = shallowClone(property); | ||
var horizontalValues = fourValues(horizontal, configuration); | ||
var verticalValues = fourValues(vertical, configuration); | ||
var horizontalValues = fourValues(horizontal); | ||
var verticalValues = fourValues(vertical); | ||
@@ -136,3 +136,3 @@ if (horizontalValues.length == verticalValues.length && | ||
} else { | ||
return fourValues(property, configuration); | ||
return fourValues(property); | ||
} | ||
@@ -139,0 +139,0 @@ } |
@@ -238,3 +238,3 @@ var sortSelectors = require('./sort-selectors'); | ||
precisionOptions.enabled = true; | ||
precisionOptions.decimalPointMatcher = new RegExp('(\\d)\\.($|' + optimizable.join('|') + ')($|\W)', 'g'); | ||
precisionOptions.decimalPointMatcher = new RegExp('(\\d)\\.($|' + optimizable.join('|') + ')($|\\W)', 'g'); | ||
precisionOptions.zeroMatcher = new RegExp('(\\d*)(\\.\\d+)(' + optimizable.join('|') + ')', 'g'); | ||
@@ -241,0 +241,0 @@ } |
@@ -74,3 +74,3 @@ var hasInherit = require('./has-inherit'); | ||
for (var i = 0, l = property.components.length; i < l; i++) { | ||
override(property.components[i], by.components[i], property.multiplex); | ||
override(property.components[i], by.components[i]); | ||
} | ||
@@ -469,3 +469,3 @@ } | ||
overridable = overridable && everyValuesPair(mayOverride.bind(null, validator), overriddenComponent, overridingComponent); | ||
overridable = everyValuesPair(mayOverride.bind(null, validator), overriddenComponent, overridingComponent); | ||
} | ||
@@ -472,0 +472,0 @@ } else { |
@@ -330,3 +330,3 @@ var canReorderSingle = require('./reorderable').canReorderSingle; | ||
movableTokens[movedProperty[4]] && movableTokens[movedProperty[4]].length === mergeLimit)) { | ||
dropPropertiesAt(i + 1, movedProperty, token); | ||
dropPropertiesAt(i + 1, movedProperty); | ||
@@ -333,0 +333,0 @@ if (movedToBeDropped.indexOf(k) == -1) { |
@@ -156,8 +156,10 @@ var DEFAULTS = { | ||
for (var key in source) { | ||
var value = source[key]; | ||
if (Object.prototype.hasOwnProperty.call(source, key)) { | ||
var value = source[key]; | ||
if (typeof value === 'object' && !Array.isArray(value)) { | ||
target[key] = merge(value, target[key] || {}); | ||
} else { | ||
target[key] = key in target ? target[key] : value; | ||
if (Object.prototype.hasOwnProperty.call(target, key) && typeof value === 'object' && !Array.isArray(value)) { | ||
target[key] = merge(value, target[key] || {}); | ||
} else { | ||
target[key] = key in target ? target[key] : value; | ||
} | ||
} | ||
@@ -164,0 +166,0 @@ } |
@@ -110,2 +110,4 @@ var Marker = require('./marker'); | ||
var characterWithNoSpecialMeaning; | ||
var isPreviousDash = false; | ||
var isVariable = false; | ||
var isRaw = false; | ||
@@ -129,2 +131,4 @@ var seekingValue = false; | ||
characterWithNoSpecialMeaning = !isSpace && !isCarriageReturn && (character >= 'A' && character <= 'Z' || character >= 'a' && character <= 'z' || character >= '0' && character <= '9' || character == '-'); | ||
isVariable = isVariable || (!seekingValue && isPreviousDash && character === '-'); | ||
isPreviousDash = character === '-'; | ||
roundBracketLevel = Math.max(roundBracketLevel, 0); | ||
@@ -238,3 +242,3 @@ | ||
isBufferEmpty = false; | ||
} else if (!isCommentStart && !isCommentEnd && character != Marker.CLOSE_ROUND_BRACKET && character != Marker.OPEN_ROUND_BRACKET && level != Level.COMMENT && !isQuoted && roundBracketLevel > 0) { | ||
} else if (character != Marker.CLOSE_ROUND_BRACKET && character != Marker.OPEN_ROUND_BRACKET && level != Level.COMMENT && !isQuoted && roundBracketLevel > 0) { | ||
// character inside any function, e.g. hsla(.<-- | ||
@@ -371,2 +375,8 @@ buffer.push(character); | ||
isBufferEmpty = true; | ||
} else if (character == Marker.SEMICOLON && level == Level.RULE && propertyToken && isBufferEmpty && isVariable && !propertyToken[2]) { | ||
// semicolon after empty variable value at rule level, e.g. a{--color: ;<-- | ||
propertyToken.push([Token.PROPERTY_VALUE, ' ', [originalMetadata(metadata, ' ', externalContext)]]); | ||
isVariable = false; | ||
propertyToken = null; | ||
seekingValue = false; | ||
} else if (character == Marker.SEMICOLON && level == Level.RULE && propertyToken && isBufferEmpty) { | ||
@@ -459,2 +469,12 @@ // semicolon after bracketed value at rule level, e.g. a{color:rgb(...);<-- | ||
isBufferEmpty = true; | ||
} else if (character == Marker.CLOSE_CURLY_BRACKET && level == Level.RULE && isVariable && propertyToken && !propertyToken[2]) { | ||
// close brace after an empty variable declaration inside a rule, e.g. a{--color: }<-- | ||
propertyToken.push([Token.PROPERTY_VALUE, ' ', [originalMetadata(metadata, ' ', externalContext)]]); | ||
isVariable = false; | ||
propertyToken = null; | ||
ruleToken = null; | ||
newTokens = allTokens; | ||
level = levels.pop(); | ||
seekingValue = false; | ||
} else if (character == Marker.CLOSE_CURLY_BRACKET && level == Level.RULE) { | ||
@@ -461,0 +481,0 @@ // close brace after a rule, e.g. a{color:red;}<-- |
{ | ||
"name": "clean-css", | ||
"version": "5.1.5", | ||
"author": "Jakub Pawlowicz <contact@jakubpawlowicz.com> (https://jakubpawlowicz.com)", | ||
"version": "5.2.0", | ||
"author": "Jakub Pawlowicz <contact@jakubpawlowicz.com>", | ||
"description": "A well-tested CSS minifier", | ||
@@ -11,9 +11,9 @@ "license": "MIT", | ||
], | ||
"homepage": "https://github.com/jakubpawlowicz/clean-css", | ||
"homepage": "https://github.com/clean-css/clean-css", | ||
"repository": { | ||
"type": "git", | ||
"url": "https://github.com/jakubpawlowicz/clean-css.git" | ||
"url": "https://github.com/clean-css/clean-css.git" | ||
}, | ||
"bugs": { | ||
"url": "https://github.com/jakubpawlowicz/clean-css/issues" | ||
"url": "https://github.com/clean-css/clean-css/issues" | ||
}, | ||
@@ -20,0 +20,0 @@ "main": "index.js", |
177
README.md
<h1 align="center"> | ||
<br/> | ||
<img src="https://cdn.rawgit.com/jakubpawlowicz/clean-css/master/logo.v2.svg" alt="clean-css logo" width="525px"/> | ||
<img src="./logo.v2.svg" alt="clean-css logo" width="525px"/> | ||
<br/> | ||
@@ -9,8 +9,8 @@ <br/> | ||
[![npm version](https://img.shields.io/npm/v/clean-css.svg?style=flat)](https://www.npmjs.com/package/clean-css) | ||
[![Build Status](https://img.shields.io/github/workflow/status/jakubpawlowicz/clean-css/Tests/master)](https://github.com/jakubpawlowicz/clean-css/actions?query=workflow%3ATests+branch%3Amaster) | ||
[![PPC Linux Build Status](https://img.shields.io/travis/jakubpawlowicz/clean-css/master.svg?style=flat&label=PPC%20Linux%20build)](https://travis-ci.org/jakubpawlowicz/clean-css) | ||
[![Dependency Status](https://img.shields.io/david/jakubpawlowicz/clean-css.svg?style=flat)](https://david-dm.org/jakubpawlowicz/clean-css) | ||
[![Build Status](https://img.shields.io/github/workflow/status/clean-css/clean-css/Tests/master)](https://github.com/clean-css/clean-css/actions?query=workflow%3ATests+branch%3Amaster) | ||
[![PPC Linux Build Status](https://img.shields.io/travis/clean-css/clean-css/master.svg?style=flat&label=PPC%20Linux%20build)](https://travis-ci.org/clean-css/clean-css) | ||
[![Dependency Status](https://img.shields.io/david/clean-css/clean-css.svg?style=flat)](https://david-dm.org/clean-css/clean-css) | ||
[![npm Downloads](https://img.shields.io/npm/dm/clean-css.svg)](https://npmcharts.com/compare/clean-css?minimal=true) | ||
clean-css is a fast and efficient CSS optimizer for [Node.js](http://nodejs.org/) platform and [any modern browser](https://jakubpawlowicz.github.io/clean-css). | ||
clean-css is a fast and efficient CSS optimizer for [Node.js](http://nodejs.org/) platform and [any modern browser](https://clean-css.github.io/). | ||
@@ -53,2 +53,3 @@ According to [tests](http://goalsmashers.github.io/css-minification-benchmark/) it is one of the best available. | ||
* [What level 2 optimizations do?](#what-level-2-optimizations-do) | ||
* [What errors and warnings are?](#what-errors-and-warnings-are) | ||
* [How to use clean-css with build tools?](#how-to-use-clean-css-with-build-tools) | ||
@@ -63,3 +64,3 @@ * [How to use clean-css from web browser?](#how-to-use-clean-css-from-web-browser) | ||
clean-css requires Node.js 6.0+ (tested on Linux, OS X, and Windows) | ||
clean-css requires Node.js 10.0+ (tested on Linux, OS X, and Windows) | ||
@@ -122,3 +123,3 @@ # Install | ||
* `removeUnusedAtRules` level 2 optimization controlling removal of unused `@counter-style`, `@font-face`, `@keyframes`, and `@namespace` at rules; | ||
* the [web interface](https://jakubpawlowicz.github.io/clean-css) gets an improved settings panel with "reset to defaults", instant option changes, and settings being persisted across sessions. | ||
* the [web interface](https://clean-css.github.io/) gets an improved settings panel with "reset to defaults", instant option changes, and settings being persisted across sessions. | ||
@@ -129,3 +130,3 @@ ## Important: 4.0 breaking changes | ||
* API and CLI interfaces are split, so API stays in this repository while CLI moves to [clean-css-cli](https://github.com/jakubpawlowicz/clean-css-cli); | ||
* API and CLI interfaces are split, so API stays in this repository while CLI moves to [clean-css-cli](https://github.com/clean-css/clean-css-cli); | ||
* `root`, `relativeTo`, and `target` options are replaced by a single `rebaseTo` option - this means that rebasing URLs and import inlining is much simpler but may not be (YMMV) as powerful as in 3.x; | ||
@@ -174,3 +175,3 @@ * `debug` option is gone as stats are always provided in output object under `stats` property; | ||
Each of these modes is an alias to a [fine grained configuration](https://github.com/jakubpawlowicz/clean-css/blob/master/lib/options/compatibility.js), with the following options available: | ||
Each of these modes is an alias to a [fine grained configuration](https://github.com/clean-css/clean-css/blob/master/lib/options/compatibility.js), with the following options available: | ||
@@ -254,3 +255,3 @@ ```js | ||
Unless given, the default [loadRemoteResource](https://github.com/jakubpawlowicz/clean-css/blob/master/lib/reader/load-remote-resource.js) logic is used. | ||
Unless given, the default [loadRemoteResource](https://github.com/clean-css/clean-css/blob/master/lib/reader/load-remote-resource.js) logic is used. | ||
@@ -504,3 +505,3 @@ ## Formatting options | ||
__Important__: To rewrite your old `transform` as a plugin, check out [this commit](https://github.com/jakubpawlowicz/clean-css/commit/b6ddc523267fc42cf0f6bd1626a79cad97319e17#diff-a71ef45f934725cdb25860dc0b606bcd59e3acee9788cd6df4f9d05339e8a153). | ||
__Important__: To rewrite your old `transform` as a plugin, check out [this commit](https://github.com/clean-css/clean-css/commit/b6ddc523267fc42cf0f6bd1626a79cad97319e17#diff-a71ef45f934725cdb25860dc0b606bcd59e3acee9788cd6df4f9d05339e8a153). | ||
@@ -527,3 +528,35 @@ ## Minify method | ||
``` | ||
Example: Minifying a CSS string: | ||
```js | ||
const CleanCSS = require("clean-css"); | ||
const output = new CleanCSS().minify(` | ||
a { | ||
color: blue; | ||
} | ||
div { | ||
margin: 5px | ||
} | ||
`); | ||
console.log(output); | ||
// Log: | ||
{ | ||
styles: 'a{color:#00f}div{margin:5px}', | ||
stats: { | ||
efficiency: 0.6704545454545454, | ||
minifiedSize: 29, | ||
originalSize: 88, | ||
timeSpent: 6 | ||
}, | ||
errors: [], | ||
inlinedStylesheets: [], | ||
warnings: [] | ||
} | ||
``` | ||
The `minify` method also accepts an input source map, e.g. | ||
@@ -556,3 +589,3 @@ | ||
Clean-css has an associated command line utility that can be installed separately using `npm install clean-css-cli`. For more detailed information, please visit https://github.com/jakubpawlowicz/clean-css-cli. | ||
Clean-css has an associated command line utility that can be installed separately using `npm install clean-css-cli`. For more detailed information, please visit https://github.com/clean-css/clean-css-cli. | ||
@@ -636,3 +669,3 @@ # FAQ | ||
Since `rpx` is a non standard unit (see [#1074](https://github.com/jakubpawlowicz/clean-css/issues/1074)), it will be dropped by default as an invalid value. | ||
Since `rpx` is a non standard unit (see [#1074](https://github.com/clean-css/clean-css/issues/1074)), it will be dropped by default as an invalid value. | ||
@@ -760,3 +793,3 @@ However you can treat `rpx` units as regular ones: | ||
All level 2 optimizations are dispatched [here](https://github.com/jakubpawlowicz/clean-css/blob/master/lib/optimizer/level-2/optimize.js#L67), and this is what they do: | ||
All level 2 optimizations are dispatched [here](https://github.com/clean-css/clean-css/blob/master/lib/optimizer/level-2/optimize.js#L67), and this is what they do: | ||
@@ -775,2 +808,104 @@ * `recursivelyOptimizeBlocks` - does all the following operations on a nested block, like `@media` or `@keyframe`; | ||
## What errors and warnings are? | ||
If clean-css encounters invalid CSS, it will try to remove the invalid part and continue optimizing the rest of the code. It will make you aware of the problem by generating an error or warning. Although clean-css can work with invalid CSS, it is always recommended that you fix warnings and errors in your CSS. | ||
Example: Minify invalid CSS, resulting in two warnings: | ||
```js | ||
const CleanCSS = require("clean-css"); | ||
const output = new CleanCSS().minify(` | ||
a { | ||
-notarealproperty-: 5px; | ||
color: | ||
} | ||
div { | ||
margin: 5px | ||
} | ||
`); | ||
console.log(output); | ||
// Log: | ||
{ | ||
styles: 'div{margin:5px}', | ||
stats: { | ||
efficiency: 0.8695652173913043, | ||
minifiedSize: 15, | ||
originalSize: 115, | ||
timeSpent: 1 | ||
}, | ||
errors: [], | ||
inlinedStylesheets: [], | ||
warnings: [ | ||
"Invalid property name '-notarealproperty-' at 4:8. Ignoring.", | ||
"Empty property 'color' at 5:8. Ignoring." | ||
] | ||
} | ||
``` | ||
Example: Minify invalid CSS, resulting in one error: | ||
```js | ||
const CleanCSS = require("clean-css"); | ||
const output = new CleanCSS().minify(` | ||
@import "idontexist.css"; | ||
a { | ||
color: blue; | ||
} | ||
div { | ||
margin: 5px | ||
} | ||
`); | ||
console.log(output); | ||
// Log: | ||
{ | ||
styles: 'a{color:#00f}div{margin:5px}', | ||
stats: { | ||
efficiency: 0.7627118644067796, | ||
minifiedSize: 28, | ||
originalSize: 118, | ||
timeSpent: 2 | ||
}, | ||
errors: [ | ||
'Ignoring local @import of "idontexist.css" as resource is missing.' | ||
], | ||
inlinedStylesheets: [], | ||
warnings: [] | ||
} | ||
``` | ||
## Clean-css for Gulp | ||
An example of how you can include clean-css in gulp | ||
```js | ||
const { src, dest, series } = require('gulp'); | ||
const CleanCSS = require('clean-css'); | ||
const concat = require('gulp-concat'); | ||
function css() { | ||
const options = { | ||
compatibility: '*', // (default) - Internet Explorer 10+ compatibility mode | ||
inline: ['all'], // enables all inlining, same as ['local', 'remote'] | ||
level: 2 // Optimization levels. The level option can be either 0, 1 (default), or 2, e.g. | ||
// Please note that level 1 optimization options are generally safe while level 2 optimizations should be safe for most users. | ||
}; | ||
return src('app/**/*.css') | ||
.pipe(concat('style.min.css')) | ||
.on('data', function(file) { | ||
const buferFile = new CleanCSS(options).minify(file.contents) | ||
return file.contents = Buffer.from(buferFile.styles) | ||
}) | ||
.pipe(dest('build')) | ||
} | ||
exports.css = series(css) | ||
``` | ||
## How to use clean-css with build tools? | ||
@@ -784,3 +919,3 @@ | ||
* [Gulp](http://gulpjs.com/): [gulp-clean-css](https://github.com/scniro/gulp-clean-css) | ||
* [Gulp](http://gulpjs.com/): [using vinyl-map as a wrapper - courtesy of @sogko](https://github.com/jakubpawlowicz/clean-css/issues/342) | ||
* [Gulp](http://gulpjs.com/): [using vinyl-map as a wrapper - courtesy of @sogko](https://github.com/clean-css/clean-css/issues/342) | ||
* [component-builder2](https://github.com/component/builder2.js): [builder-clean-css](https://github.com/poying/builder-clean-css) | ||
@@ -793,3 +928,3 @@ * [Metalsmith](http://metalsmith.io): [metalsmith-clean-css](https://github.com/aymericbeaumet/metalsmith-clean-css) | ||
* https://jakubpawlowicz.github.io/clean-css/ (official web interface) | ||
* https://clean-css.github.io/ (official web interface) | ||
* http://refresh-sf.com/ | ||
@@ -800,3 +935,3 @@ * http://adamburgess.github.io/clean-css-online/ | ||
See [CONTRIBUTING.md](https://github.com/jakubpawlowicz/clean-css/blob/master/CONTRIBUTING.md). | ||
See [CONTRIBUTING.md](https://github.com/clean-css/clean-css/blob/master/CONTRIBUTING.md). | ||
@@ -808,3 +943,3 @@ ## How to get started? | ||
```bash | ||
git clone git@github.com:jakubpawlowicz/clean-css.git | ||
git clone git@github.com:clean-css/clean-css.git | ||
``` | ||
@@ -822,3 +957,3 @@ | ||
```bash | ||
npm run bench # for clean-css benchmarks (see [test/bench.js](https://github.com/jakubpawlowicz/clean-css/blob/master/test/bench.js) for details) | ||
npm run bench # for clean-css benchmarks (see [test/bench.js](https://github.com/clean-css/clean-css/blob/master/test/bench.js) for details) | ||
npm run browserify # to create the browser-ready clean-css version | ||
@@ -842,3 +977,3 @@ npm run check # to lint JS sources with [JSHint](https://github.com/jshint/jshint/) | ||
* [@lukeapage](https://github.com/lukeapage) (Luke Page) for suggestions and testing the source maps feature; | ||
Plus everyone else involved in [#125](https://github.com/jakubpawlowicz/clean-css/issues/125) for pushing it forward; | ||
Plus everyone else involved in [#125](https://github.com/clean-css/clean-css/issues/125) for pushing it forward; | ||
* [@madwizard-thomas](https://github.com/madwizard-thomas) for sharing ideas about `@import` inlining and URL rebasing. | ||
@@ -853,2 +988,2 @@ * [@ngyikp](https://github.com/ngyikp) (Ng Yik Phang) for testing early clean-css 4 versions, reporting bugs, and suggesting numerous improvements. | ||
clean-css is released under the [MIT License](https://github.com/jakubpawlowicz/clean-css/blob/master/LICENSE). | ||
clean-css is released under the [MIT License](https://github.com/clean-css/clean-css/blob/master/LICENSE). |
Sorry, the diff of this file is too big to display
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
483154
10347
970