closure-stylesheets
v1.0.1 closure-stylesheets closure css stylesheets
closure-stylesheets
closure-stylesheets
is A Node API to Closure Stylesheets.
yarn add closure-stylesheets
Table Of Contents
- Table Of Contents
- API
async compileStylesheets(css, config, log=): ClosureReturn
compileStylesheetsSync(css, config, log=): ClosureReturn
- Copyright
API
The package is available by importing its default function:
import closureStylesheets, { closureStylesheetsSync } from 'closure-stylesheets'
async compileStylesheets(
css: (string|!Array<string>),
config: !ClosureStylesheetsConfig,
log=: !Function,
): ClosureReturn
Compiles stylesheets asynchronously.
- css*
(string | !Array<string>)
: The resolved path to the CSS file to compile. - config*
!ClosureStylesheetsConfig
: Additional configuration to transform into arguments to Java. Requires at list path to the JAR file. - log
!Function
(optional): The logging function.
ClosureStylesheetsConfig
: Configuration options.
Name | Type & Description | Default |
---|---|---|
path* | string | - |
The path to the closure JAR. You can use closure-stylesheets-java package
to install it via Node.
|
||
skipHTMLEscaping | boolean | false |
By default, the compiler will escape [<>\"&'] from output
to make it suitable for safe embedding in HTML tags and attributes.
When standalone CSS is generated, this is not necessary and can be skipped.
|
||
expandBrowserPrefix | boolean | false |
Expand CSS rules to include vendor-prefixed declarations. | ||
outputBrowserPrefix | string | - |
The location of the file where to output the prefixed version of the CSS.
Works only when expandBrowserPrefix is set.
The filename should end with .css and the compiler will also create a .json file
at the same location with the map to check for support.
|
||
prefixes | !Array<string> | - |
CSS rule prefixes (position:sticky , -ms-hyphens .) to include in the main output CSS rather than browser prefix file.
|
||
prettyPrint | boolean | false |
Whether to format the output with newlines and indents so that it is more readable. | ||
sourceMap | string | - |
Provides a mapping from the generated output to their original source code location. | ||
rootSelector | string | - |
The string to prepend to selectors of each ruleset. | ||
allowUnrecognizedProperties | boolean | false |
Allow unrecognized properties. | ||
preserveImportantComments | boolean | false |
Preserve important comments from sources into minified output css. Important comments are marked with /*! */ , @license , or @preserve .
|
||
cssRenamingPrefix | string | - |
Add a prefix to all renamed css class names. | ||
whitelist | !Array<string> | - |
Excluded classes from renaming. | ||
outputRenamingMap | string | - |
How to format the output from the CSS class renaming. | ||
inputRenamingMap | string | - |
The input filename for the CSS class renaming. The file must provide a map of class names that will be used for renaming. If a class name is not found in file, a new name will be generated.
--input-renaming-map
|
||
rename | string | - |
How CSS classes should be renamed. Defaults to NONE.
Can be CLOSURE , SIMPLE , DEBUG .
|
||
excludedClassesFromRenaming | !Array<string> | - |
Pass the compiler a list of CSS class names that shouldn't be renamed. |
ClosureReturn
: Returns stylesheet and rename map if successful, or parsed info, stderr and status otherwise.
Name | Type & Description |
---|---|
block | string |
Parsed error information with CLI colour. | |
stderr | string |
Full stderr output in case of error. | |
status | number |
Exit error code. | |
renameMap | Object |
If renaming was on, this is the generated map parsed into an object. | |
stylesheet | string |
The actual compiled stylesheet in case of success. |
For example, we can compile this simple stylesheet:
.MyElement {
color: green;
}
import compileStylesheets from 'closure-stylesheets'
import path from 'closure-stylesheets-java'
(async () => {
const res = await compileStylesheets('example/style.css', {
path,
rootSelector: '.Example',
}, console.error)
console.log(res)
})()
{
renameMap: { MyElement: 'a' },
stylesheet: '.Example .a{color:green}'
}
Logging of the executed command will be done into console.error
since it was passed as the third argument.
java -jar /Users/zavr/node_modules/closure-stylesheets-java/target/closure-stylesheets-1.12.1-SNAPSHOT-jar-with-dependencies.jar "example/style.css" --root-selector .Example --output-renaming-map temp-rename-map.json --output-renaming-map-format JSON --rename SIMPLE
The sync version with the same API is also available.
compileStylesheetsSync(
css: (string|!Array<string>),
config: !ClosureStylesheetsConfig,
log=: !Function,
): ClosureReturn
Compiles stylesheets in a sync manner.
- css*
(string | !Array<string>)
: The resolved path to the CSS file to compile. - config*
!ClosureStylesheetsConfig
: Additional configuration to transform into arguments to Java. Requires at list path to the JAR file. - log
!Function
(optional): The logging function.
import { compileStylesheetsSync } from 'closure-stylesheets'
import path from 'closure-stylesheets-java'
const resSync = compileStylesheetsSync('example/style.css', {
path,
rootSelector: '.HelloWorld',
whitelist: ['MyElement'],
}, console.error)
console.log(resSync)
{ renameMap: {}, stylesheet: '.HelloWorld .MyElement{color:green}' }
Copyright
© Art Deco™ 2020 |
---|