10
10
<img src =" https://evilmartians.com/badges/sponsored-by-evil-martians.svg " alt =" Sponsored by Evil Martians " width =" 236 " height =" 54 " >
11
11
</a >
12
12
13
- [ PostCSS plugins ] : https://github.com/postcss/postcss#built-with-postcss
13
+ [ PostCSS plugins ] : https://github.com/postcss/postcss#plugins
14
14
[ PostCSS ] : https://github.com/postcss/postcss
15
15
[ webpack ] : http://webpack.github.io/
16
16
[ ci-img ] : https://travis-ci.org/postcss/postcss-loader.svg
21
21
Set ` postcss ` section in webpack config:
22
22
23
23
``` js
24
- var autoprefixer = require (' autoprefixer-core ' );
25
- var csswring = require (' csswring ' );
24
+ var autoprefixer = require (' autoprefixer' );
25
+ var cssnext = require (' cssnext ' );
26
26
27
27
module .exports = {
28
28
module: {
@@ -34,7 +34,7 @@ module.exports = {
34
34
]
35
35
},
36
36
postcss : function () {
37
- return [autoprefixer, csswring ];
37
+ return [autoprefixer, cssnext ];
38
38
}
39
39
}
40
40
```
@@ -52,7 +52,7 @@ Note that the context of this function
52
52
module .exports = {
53
53
...
54
54
postcss : function () {
55
- return [autoprefixer, csswring ];
55
+ return [autoprefixer, cssnext ];
56
56
}
57
57
}
58
58
```
@@ -83,7 +83,7 @@ module.exports = {
83
83
},
84
84
postcss : function () {
85
85
return {
86
- defaults: [autoprefixer, csswring ],
86
+ defaults: [autoprefixer, cssnext ],
87
87
cleaner: [autoprefixer ({ browsers: [] })]
88
88
};
89
89
}
@@ -136,11 +136,19 @@ module.exports = {
136
136
[ postcss-import ] : https://github.com/postcss/postcss-import
137
137
[ onImport ] : https://github.com/postcss/postcss-import#onimport
138
138
139
- ## Safe Mode
139
+ ## Custom Syntaxes
140
+
141
+ PostCSS can transforms styles in any syntax, not only in CSS.
142
+ There are 3 parameters to control syntax:
140
143
141
- If you add ` ?safe=1 ` to requirement, PostCSS will try to correct any syntax
142
- error that it finds in the CSS. For example, it will parse ` a { ` as ` a {} ` .
144
+ * ` syntax ` accepts module name with ` parse ` and ` stringify ` function.
145
+ * ` parser ` accepts module name with input parser function.
146
+ * ` stringifier ` accepts module name with output stringifier function.
147
+
148
+ For example, you can use [ Safe Parser] to find and fix any CSS errors:
143
149
144
150
``` js
145
- var css = require (' postcss?safe=1 !./broken' )
151
+ var css = require (' postcss?parser=postcss-safe-parser !./broken' )
146
152
```
153
+
154
+ [ Safe Parser ] : https://github.com/postcss/postcss-safe-parser
0 commit comments