https://github.com/artdecocode/closure-stylesheets
A Node API to Closure Stylesheets.
https://github.com/artdecocode/closure-stylesheets
Last synced: 6 months ago
JSON representation
A Node API to Closure Stylesheets.
- Host: GitHub
- URL: https://github.com/artdecocode/closure-stylesheets
- Owner: artdecocode
- License: agpl-3.0
- Created: 2019-09-06T21:44:37.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-03-16T09:43:42.000Z (almost 6 years ago)
- Last Synced: 2025-06-04T20:16:14.604Z (7 months ago)
- Language: JavaScript
- Homepage: https://www.artd.eco
- Size: 67.4 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# closure-stylesheets
[](https://www.npmjs.com/package/closure-stylesheets)
`closure-stylesheets` is A Node API to Closure Stylesheets.
```sh
yarn add closure-stylesheets
```
## Table Of Contents
- [Table Of Contents](#table-of-contents)
- [API](#api)
- [`async compileStylesheets(css, config, log=): ClosureReturn`](#async-compilestylesheetscss-stringarraystringconfig-closurestylesheetsconfiglog-function-closurereturn)
* [`ClosureStylesheetsConfig`](#type-closurestylesheetsconfig)
* [`ClosureReturn`](#type-closurereturn)
- [`compileStylesheetsSync(css, config, log=): ClosureReturn`](#compilestylesheetssynccss-stringarraystringconfig-closurestylesheetsconfiglog-function-closurereturn)
- [Copyright](#copyright)
## API
The package is available by importing its default function:
```js
import closureStylesheets, { closureStylesheetsSync } from 'closure-stylesheets'
```
## async compileStylesheets(
`css: (string|!Array),`
`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:_
```css
.MyElement {
color: green;
}
```
```js
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)
})()
```
```js
{
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),`
`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.
```js
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)
```
```js
{ renameMap: {}, stylesheet: '.HelloWorld .MyElement{color:green}' }
```
## Copyright
© Art Deco™ 2020