mirror of
https://github.com/S2-/minifyfromhtml.git
synced 2025-08-03 04:10:04 +02:00
update node modules
This commit is contained in:
198
node_modules/clean-css/README.md
generated
vendored
198
node_modules/clean-css/README.md
generated
vendored
@@ -5,12 +5,11 @@
|
||||
<br/>
|
||||
</h1>
|
||||
|
||||
[](https://www.npmjs.com/package/clean-css)
|
||||
[](https://travis-ci.org/jakubpawlowicz/clean-css)
|
||||
[](https://ci.appveyor.com/project/jakubpawlowicz/clean-css/branch/master)
|
||||
[](https://www.npmjs.com/package/clean-css)
|
||||
[](https://github.com/jakubpawlowicz/clean-css/actions?query=workflow%3ATests+branch%3Amaster)
|
||||
[](https://travis-ci.org/jakubpawlowicz/clean-css)
|
||||
[](https://david-dm.org/jakubpawlowicz/clean-css)
|
||||
[](https://npmcharts.com/compare/clean-css?minimal=true)
|
||||
[](https://twitter.com/cleancss)
|
||||
[](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).
|
||||
|
||||
@@ -21,9 +20,10 @@ According to [tests](http://goalsmashers.github.io/css-minification-benchmark/)
|
||||
- [Node.js version support](#nodejs-version-support)
|
||||
- [Install](#install)
|
||||
- [Use](#use)
|
||||
* [Important: 4.0 breaking changes](#important-40-breaking-changes)
|
||||
* [What's new in version 4.1](#whats-new-in-version-41)
|
||||
* [What's new in version 5.0](#whats-new-in-version-50)
|
||||
* [What's new in version 4.2](#whats-new-in-version-42)
|
||||
* [What's new in version 4.1](#whats-new-in-version-41)
|
||||
* [Important: 4.0 breaking changes](#important-40-breaking-changes)
|
||||
* [Constructor options](#constructor-options)
|
||||
* [Compatibility modes](#compatibility-modes)
|
||||
* [Fetch option](#fetch-option)
|
||||
@@ -33,11 +33,13 @@ According to [tests](http://goalsmashers.github.io/css-minification-benchmark/)
|
||||
+ [Level 0 optimizations](#level-0-optimizations)
|
||||
+ [Level 1 optimizations](#level-1-optimizations)
|
||||
+ [Level 2 optimizations](#level-2-optimizations)
|
||||
* [Plugins](#plugins)
|
||||
* [Minify method](#minify-method)
|
||||
* [Promise interface](#promise-interface)
|
||||
* [CLI utility](#cli-utility)
|
||||
- [FAQ](#faq)
|
||||
* [How to optimize multiple files?](#how-to-optimize-multiple-files)
|
||||
* [How to process multiple files without concatenating them into one output file?](#how-to-process-multiple-files-without-concatenating-them-into-one-output-file)
|
||||
* [How to process remote `@import`s correctly?](#how-to-process-remote-imports-correctly)
|
||||
* [How to apply arbitrary transformations to CSS properties?](#how-to-apply-arbitrary-transformations-to-css-properties)
|
||||
* [How to specify a custom rounding precision?](#how-to-specify-a-custom-rounding-precision)
|
||||
@@ -56,7 +58,7 @@ According to [tests](http://goalsmashers.github.io/css-minification-benchmark/)
|
||||
|
||||
# Node.js version support
|
||||
|
||||
clean-css requires Node.js 4.0+ (tested on Linux, OS X, and Windows)
|
||||
clean-css requires Node.js 6.0+ (tested on Linux, OS X, and Windows)
|
||||
|
||||
# Install
|
||||
|
||||
@@ -73,6 +75,49 @@ var options = { /* options */ };
|
||||
var output = new CleanCSS(options).minify(input);
|
||||
```
|
||||
|
||||
## What's new in version 5.0
|
||||
|
||||
clean-css 5.0 will introduce some breaking changes:
|
||||
|
||||
* Node.js 6.x and 8.x are officially no longer supported;
|
||||
* `transform` callback in level-1 optimizations is removed in favor of new [plugins](#plugins) interface;
|
||||
* changes default Internet Explorer compatibility from 10+ to >11, to revert the old default use `{ compatibility: 'ie10' }` flag;
|
||||
* changes default `rebase` option from `true` to `false` so URLs are not rebased by default. Please note that if you set `rebaseTo` option it still counts as setting `rebase: true` to preserve some of the backward compatibility.
|
||||
|
||||
And on the new features side of things:
|
||||
|
||||
* format options now accepts numerical values for all breaks, which will allow you to have more control over output formatting, e.g. `format: {breaks: {afterComment: 2}}` means clean-css will add two line breaks after each comment
|
||||
* a new `batch` option (defaults to `false`) is added, when set to `true` it will process all inputs, given either as an array or a hash, without concatenating them.
|
||||
|
||||
## What's new in version 4.2
|
||||
|
||||
clean-css 4.2 introduces the following changes / features:
|
||||
|
||||
* Adds `process` method for compatibility with optimize-css-assets-webpack-plugin;
|
||||
* new `transition` property optimizer;
|
||||
* preserves any CSS content between `/* clean-css ignore:start */` and `/* clean-css ignore:end */` comments;
|
||||
* allows filtering based on selector in `transform` callback, see [example](#how-to-apply-arbitrary-transformations-to-css-properties);
|
||||
* adds configurable line breaks via `format: { breakWith: 'lf' }` option.
|
||||
|
||||
## What's new in version 4.1
|
||||
|
||||
clean-css 4.1 introduces the following changes / features:
|
||||
|
||||
* `inline: false` as an alias to `inline: ['none']`;
|
||||
* `multiplePseudoMerging` compatibility flag controlling merging of rules with multiple pseudo classes / elements;
|
||||
* `removeEmpty` flag in level 1 optimizations controlling removal of rules and nested blocks;
|
||||
* `removeEmpty` flag in level 2 optimizations controlling removal of rules and nested blocks;
|
||||
* `compatibility: { selectors: { mergeLimit: <number> } }` flag in compatibility settings controlling maximum number of selectors in a single rule;
|
||||
* `minify` method improved signature accepting a list of hashes for a predictable traversal;
|
||||
* `selectorsSortingMethod` level 1 optimization allows `false` or `'none'` for disabling selector sorting;
|
||||
* `fetch` option controlling a function for handling remote requests;
|
||||
* new `font` shorthand and `font-*` longhand optimizers;
|
||||
* removal of `optimizeFont` flag in level 1 optimizations due to new `font` shorthand optimizer;
|
||||
* `skipProperties` flag in level 2 optimizations controlling which properties won't be optimized;
|
||||
* new `animation` shorthand and `animation-*` longhand optimizers;
|
||||
* `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.
|
||||
|
||||
## Important: 4.0 breaking changes
|
||||
|
||||
clean-css 4.0 introduces some breaking changes:
|
||||
@@ -95,35 +140,6 @@ clean-css 4.0 introduces some breaking changes:
|
||||
* `sourceMap` option has to be a boolean from now on - to specify an input source map pass it a 2nd argument to `minify` method or via a hash instead;
|
||||
* `aggressiveMerging` option is removed as aggressive merging is replaced by smarter override merging.
|
||||
|
||||
## What's new in version 4.1
|
||||
|
||||
clean-css 4.1 introduces the following changes / features:
|
||||
|
||||
* `inline: false` as an alias to `inline: ['none']`;
|
||||
* `multiplePseudoMerging` compatibility flag controlling merging of rules with multiple pseudo classes / elements;
|
||||
* `removeEmpty` flag in level 1 optimizations controlling removal of rules and nested blocks;
|
||||
* `removeEmpty` flag in level 2 optimizations controlling removal of rules and nested blocks;
|
||||
* `compatibility: { selectors: { mergeLimit: <number> } }` flag in compatibility settings controlling maximum number of selectors in a single rule;
|
||||
* `minify` method improved signature accepting a list of hashes for a predictable traversal;
|
||||
* `selectorsSortingMethod` level 1 optimization allows `false` or `'none'` for disabling selector sorting;
|
||||
* `fetch` option controlling a function for handling remote requests;
|
||||
* new `font` shorthand and `font-*` longhand optimizers;
|
||||
* removal of `optimizeFont` flag in level 1 optimizations due to new `font` shorthand optimizer;
|
||||
* `skipProperties` flag in level 2 optimizations controlling which properties won't be optimized;
|
||||
* new `animation` shorthand and `animation-*` longhand optimizers;
|
||||
* `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.
|
||||
|
||||
## What's new in version 4.2
|
||||
|
||||
clean-css 4.2 introduces the following changes / features:
|
||||
|
||||
* Adds `process` method for compatibility with optimize-css-assets-webpack-plugin;
|
||||
* new `transition` property optimizer;
|
||||
* preserves any CSS content between `/* clean-css ignore:start */` and `/* clean-css ignore:end */` comments;
|
||||
* allows filtering based on selector in `transform` callback, see [example](#how-to-apply-arbitrary-transformations-to-css-properties);
|
||||
* adds configurable line breaks via `format: { breakWith: 'lf' }` option.
|
||||
|
||||
## Constructor options
|
||||
|
||||
clean-css constructor accepts a hash as a parameter with the following options available:
|
||||
@@ -135,7 +151,7 @@ clean-css constructor accepts a hash as a parameter with the following options a
|
||||
* `inlineRequest` - controls extra options for inlining remote `@import` rules, can be any of [HTTP(S) request options](https://nodejs.org/api/http.html#http_http_request_options_callback);
|
||||
* `inlineTimeout` - controls number of milliseconds after which inlining a remote `@import` fails; defaults to 5000;
|
||||
* `level` - controls optimization level used; defaults to `1`; see [optimization levels](#optimization-levels) for examples;
|
||||
* `rebase` - controls URL rebasing; defaults to `true`;
|
||||
* `rebase` - controls URL rebasing; defaults to `false`;
|
||||
* `rebaseTo` - controls a directory to which all URLs are rebased, most likely the directory under which the output file will live; defaults to the current directory;
|
||||
* `returnPromise` - controls whether `minify` method returns a Promise object or not; defaults to `false`; see [promise interface](#promise-interface) for examples;
|
||||
* `sourceMap` - controls whether an output source map is built; defaults to `false`;
|
||||
@@ -156,6 +172,7 @@ Each of these modes is an alias to a [fine grained configuration](https://github
|
||||
new CleanCSS({
|
||||
compatibility: {
|
||||
colors: {
|
||||
hexAlpha: false, // controls 4- and 8-character hex color support
|
||||
opacity: true // controls `rgba()` / `hsla()` color support
|
||||
},
|
||||
properties: {
|
||||
@@ -170,7 +187,7 @@ new CleanCSS({
|
||||
merging: true, // controls property merging based on understandability
|
||||
shorterLengthUnits: false, // controls shortening pixel units into `pc`, `pt`, or `in` units
|
||||
spaceAfterClosingBrace: true, // controls keeping space after closing brace - `url() no-repeat` into `url()no-repeat`
|
||||
urlQuotes: false, // controls keeping quoting inside `url()`
|
||||
urlQuotes: true, // controls keeping quoting inside `url()`
|
||||
zeroUnits: true // controls removal of units `0` value
|
||||
},
|
||||
selectors: {
|
||||
@@ -273,11 +290,34 @@ new CleanCSS({
|
||||
beforeBlockBegins: false, // controls if a space comes before a block begins; e.g. `.block {`; defaults to `false`
|
||||
beforeValue: false // controls if a space comes before a value; e.g. `width: 1rem`; defaults to `false`
|
||||
},
|
||||
wrapAt: false // controls maximum line length; defaults to `false`
|
||||
wrapAt: false, // controls maximum line length; defaults to `false`
|
||||
semicolonAfterLastProperty: false // controls removing trailing semicolons in rule; defaults to `false` - means remove
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
Also since clean-css 5.0 you can use numerical values for all line breaks, which will repeat a line break that many times, e.g:
|
||||
|
||||
```js
|
||||
new CleanCSS({
|
||||
format: {
|
||||
breaks: {
|
||||
afterAtRule: 2,
|
||||
afterBlockBegins: 1, // 1 is synonymous with `true`
|
||||
afterBlockEnds: 2,
|
||||
afterComment: 1,
|
||||
afterProperty: 1,
|
||||
afterRuleBegins: 1,
|
||||
afterRuleEnds: 1,
|
||||
beforeBlockEnds: 1,
|
||||
betweenSelectors: 0 // 0 is synonymous with `false`
|
||||
}
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
which will add nicer spacing between at rules and blocks.
|
||||
|
||||
## Inlining options
|
||||
|
||||
`inline` option whitelists which `@import` rules will be processed, e.g.
|
||||
@@ -368,9 +408,7 @@ new CleanCSS({
|
||||
specialComments: 'all', // denotes a number of /*! ... */ comments preserved; defaults to `all`
|
||||
tidyAtRules: true, // controls at-rules (e.g. `@charset`, `@import`) optimizing; defaults to `true`
|
||||
tidyBlockScopes: true, // controls block scopes (e.g. `@media`) optimizing; defaults to `true`
|
||||
tidySelectors: true, // controls selectors optimizing; defaults to `true`,
|
||||
semicolonAfterLastProperty: false, // controls removing trailing semicolons in rule; defaults to `false` - means remove
|
||||
transform: function () {} // defines a callback for fine-grained property optimization; defaults to no-op
|
||||
tidySelectors: true, // controls selectors optimizing; defaults to `true`
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -433,6 +471,31 @@ new CleanCSS({
|
||||
});
|
||||
```
|
||||
|
||||
## Plugins
|
||||
|
||||
In clean-css version 5 and above you can define plugins which run alongside level 1 and level 2 optimizations, e.g.
|
||||
|
||||
```js
|
||||
var myPlugin = {
|
||||
level1: {
|
||||
property: function removeRepeatedBackgroundRepeat(_rule, property, _options) {
|
||||
// So `background-repeat:no-repeat no-repeat` becomes `background-repeat:no-repeat`
|
||||
if (property.name == 'background-repeat' && property.value.length == 2 && property.value[0][1] == property.value[1][1]) {
|
||||
property.value.pop();
|
||||
property.dirty = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
new CleanCSS({plugins: [myPlugin]})
|
||||
|
||||
```
|
||||
|
||||
Search `test\module-test.js` for `plugins` or check out `lib/optimizer/level-1/property-optimizers` and `lib/optimizer/level-1/value-optimizers` for more examples.
|
||||
|
||||
__Important__: To rewrite your old `transform` as a plugin, check out [this commit](https://github.com/jakubpawlowicz/clean-css/commit/b6ddc523267fc42cf0f6bd1626a79cad97319e17#diff-a71ef45f934725cdb25860dc0b606bcd59e3acee9788cd6df4f9d05339e8a153).
|
||||
|
||||
## Minify method
|
||||
|
||||
Once configured clean-css provides a `minify` method to optimize a given CSS, e.g.
|
||||
@@ -515,6 +578,16 @@ Passing an array of hashes allows you to explicitly specify the order in which t
|
||||
|
||||
Important note - any `@import` rules already present in the hash will be resolved in memory.
|
||||
|
||||
## How to process multiple files without concatenating them into one output file?
|
||||
|
||||
Since clean-css 5.0 you can, when passing an array of paths, hash, or array of hashes (see above), ask clean-css not to join styles into one output, but instead return stylesheets optimized one by one, e.g.
|
||||
|
||||
```js
|
||||
var output = new CleanCSS({ batch: true }).minify(['path/to/file/one', 'path/to/file/two']);
|
||||
var outputOfFile1 = output['path/to/file/one'].styles // all other fields, like errors, warnings, or stats are there too
|
||||
var outputOfFile2 = output['path/to/file/two'].styles
|
||||
```
|
||||
|
||||
## How to process remote `@import`s correctly?
|
||||
|
||||
In order to inline remote `@import` statements you need to provide a callback to minify method as fetching remote assets is an asynchronous operation, e.g.:
|
||||
@@ -530,26 +603,7 @@ If you don't provide a callback, then remote `@import`s will be left as is.
|
||||
|
||||
## How to apply arbitrary transformations to CSS properties?
|
||||
|
||||
If clean-css doesn't perform a particular property optimization, you can use `transform` callback to apply it:
|
||||
|
||||
```js
|
||||
var source = '.block{background-image:url(/path/to/image.png)}';
|
||||
var output = new CleanCSS({
|
||||
level: {
|
||||
1: {
|
||||
transform: function (propertyName, propertyValue, selector /* `selector` available since 4.2.0-pre */) {
|
||||
if (propertyName == 'background-image' && propertyValue.indexOf('/path/to') > -1) {
|
||||
return propertyValue.replace('/path/to', '../valid/path/to');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}).minify(source);
|
||||
|
||||
console.log(output.styles); # => .block{background-image:url(../valid/path/to/image.png)}
|
||||
```
|
||||
|
||||
Note: returning `false` from `transform` callback will drop a property.
|
||||
Please see [plugins](#plugins).
|
||||
|
||||
## How to specify a custom rounding precision?
|
||||
|
||||
@@ -567,9 +621,25 @@ new CleanCSS({
|
||||
|
||||
which sets all units rounding precision to 3 digits except `px` unit precision of 5 digits.
|
||||
|
||||
## How to optimize a stylesheet with custom `rpx` units?
|
||||
|
||||
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.
|
||||
|
||||
However you can treat `rpx` units as regular ones:
|
||||
|
||||
```js
|
||||
new CleanCSS({
|
||||
compatibility: {
|
||||
customUnits: {
|
||||
rpx: true
|
||||
}
|
||||
}
|
||||
}).minify(source)
|
||||
```
|
||||
|
||||
## How to keep a CSS fragment intact?
|
||||
|
||||
Note: available in the current master, to be released in 4.2.0.
|
||||
Note: available since 4.2.0.
|
||||
|
||||
Wrap the CSS fragment in special comments which instruct clean-css to preserve it, e.g.
|
||||
|
||||
|
Reference in New Issue
Block a user