@@ -6,37 +6,50 @@ CSS parser for node and the browser
6
6
7
7
``` shell
8
8
$ npm install @tbela99/css-parser
9
+
9
10
```
10
11
11
12
## Transform
12
13
13
14
Parse and render css in a single pass.
14
15
16
+ ### Usage
17
+
15
18
``` javascript
16
- import {transform } from ' @tbela99/css-parser' ;
17
19
18
- const { ast , code , errors , stats } = transform (css);
20
+ transform (css, transformOptions = {})
19
21
```
20
22
21
- ### Usage
23
+ ### Example
22
24
23
25
``` javascript
24
26
25
- transform (css, transformOptions = {})
27
+ import {transform } from ' @tbela99/css-parser' ;
28
+
29
+ const {ast , code , errors , stats } = await transform (css, {compress: true , resolveImport: true , cwd: ' files/css' });
26
30
```
31
+
27
32
### TransformOptions
28
33
29
- Include both ParseOptions and RenderOptions
34
+ Include ParseOptions and RenderOptions
35
+
36
+ #### ParseOptions
30
37
31
38
- src: string, optional. css file location to be used with sourcemap.
32
- - location: boolean, optional. includes node location in the ast, required for sourcemap generation.
33
- - processImport: boolean, process @import node - not yet implemented
34
- - compress: boolean, default to _ true_ . optimize ast and minify css.
39
+ - compress: boolean, optional. default to _ true_ . optimize ast and minify css.
35
40
- removeEmpty: boolean, remove empty nodes from the ast.
41
+ - location: boolean, optional. includes node location in the ast, required for sourcemap generation.
42
+ - cwd: string, optional. the current working directory. when specified url() are resolved using this value
43
+ - resolveImport: boolean, optional. replace @import node by the content of the referenced stylesheet.
44
+ - resolveUrls: boolean, optional. resolve css url() according to the parameters 'src' and 'cwd'
45
+
46
+ #### RenderOptions
47
+ - compress: boolean, optional. default to _ true_ . optimize ast and minify css.
36
48
- indent: string, optional. css indention string. uses space character by default.
37
49
- newLine: string, new line character.
38
50
- removeComments: boolean, remove comments in generated css.
39
51
- preserveLicense: boolean, force preserving comments starting with '/\* !' when compress is enabling.
52
+ - colorConvert: boolean, convert colors to hex.
40
53
41
54
42
55
## Parsing
@@ -53,38 +66,33 @@ const {ast, errors} = parse(css);
53
66
54
67
parse (css, parseOptions = {})
55
68
```
56
- ### ParseOptions
57
69
58
- - src: string, optional. css file location
59
- - location: boolean, optional. includes node location in the ast
60
- - processImport: boolean, process @import node - not yet implemented
61
- - deduplicate: boolean, remove duplicate node and merge rules
62
- - removeEmpty: boolean, remove empty nodes
70
+ ### Example
63
71
72
+ ```` javascript
73
+
74
+ const {ast , errors } = await parse (css);
75
+ ````
64
76
65
77
## Rendering
66
78
67
79
### Usage
68
80
81
+ ``` javascript
82
+ render (ast, RenderOptions = {});
83
+ ```
84
+
85
+ ### Example
86
+
69
87
``` javascript
70
88
import {render } from ' @tbela99/css-parser' ;
71
89
72
- // pretty print
73
- const prettyPrint = render (ast);
74
90
// minified
75
91
const {code } = render (ast, {compress: true });
76
92
77
93
console .log (code);
78
94
```
79
95
80
- ### RenderOptions
81
-
82
- - compress: boolean, optional. minify output. Also remove comments
83
- - indent: string, optional. indention string. uses space character by default.
84
- - newLine: string, new line character
85
- - removeComments: boolean, remove comments
86
- - preserveLicense: boolean, force preserving comments starting with '/\* !'
87
-
88
96
## Node Walker
89
97
90
98
``` javascript
@@ -96,6 +104,54 @@ for (const {node, parent, root} of walk(ast)) {
96
104
}
97
105
```
98
106
107
+ ## Exports
108
+
109
+ There are several ways to import the library into your application.
110
+
111
+ ### Node exports
112
+
113
+ import as a module
114
+
115
+ ``` javascript
116
+
117
+ import {transform } from ' @tbela99/css-parser' ;
118
+
119
+ // ...
120
+ ```
121
+ import as a CommonJS module
122
+
123
+ ``` javascript
124
+
125
+ import {transform } from ' @tbela99/css-parser/cjs' ;
126
+
127
+ // ...
128
+ ```
129
+
130
+ ### Web export
131
+
132
+ Programmatic import
133
+
134
+ ``` javascript
135
+
136
+ import {transform } from ' @tbela99/css-parser/web' ;
137
+
138
+ // ...
139
+ ```
140
+
141
+ Javascript module
142
+
143
+ ``` javascript
144
+
145
+ < script src= " dist/web/index.js" type= " module" >< / script>
146
+ ```
147
+
148
+ Single JavaScript file
149
+
150
+ ``` javascript
151
+
152
+ < script src= " dist/index-umd-web.js" >< / script>
153
+ ```
154
+
99
155
## AST
100
156
101
157
### Comment
0 commit comments