Skip to content

Commit 64b370a

Browse files
committed
Add webpack 2 docs
1 parent adedf78 commit 64b370a

File tree

1 file changed

+78
-0
lines changed

1 file changed

+78
-0
lines changed

README.md

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,27 @@ npm install postcss-loader --save-dev
2828
Add PostCSS Loader to `webpack.config.js`. Put it after `css-loader`
2929
and `style-loader`. But before `sass-loader`, if you use it.
3030

31+
Webpack 2:
32+
33+
```js
34+
module.exports = {
35+
module: {
36+
rules: [
37+
{
38+
test: /\.css$/,
39+
use: [
40+
'style-loader',
41+
'css-loader?importLoaders=1',
42+
'postcss-loader'
43+
]
44+
}
45+
]
46+
}
47+
}
48+
```
49+
50+
Webpack 1:
51+
3152
```js
3253
module.exports = {
3354
module: {
@@ -67,6 +88,63 @@ You can read more about common PostCSS config in [postcss-load-config].
6788

6889
## Options
6990

91+
### Plugins
92+
93+
We recommend to use `postcss.config.js`, but also you can specify plugins
94+
directly in webpack config.
95+
96+
#### Webpack 2
97+
98+
```js
99+
module.exports = {
100+
module: {
101+
rules: [
102+
{
103+
test: /\.css/,
104+
use: [
105+
106+
{
107+
loader: 'postcss-loader',
108+
options: {
109+
plugins: function () {
110+
return [
111+
require('precss'),
112+
require('autoprefixer')
113+
];
114+
}
115+
}
116+
}
117+
]
118+
}
119+
]
120+
}
121+
}
122+
```
123+
124+
#### Webpack 1
125+
126+
```js
127+
module.exports = {
128+
module: {
129+
loaders: [
130+
{
131+
test: /\.css$/,
132+
loaders: [
133+
134+
'postcss-loader'
135+
]
136+
}
137+
]
138+
},
139+
postcss: () => {
140+
return [
141+
require('precss'),
142+
require('autoprefixer')
143+
];
144+
}
145+
}
146+
```
147+
70148
### Syntaxes
71149

72150
PostCSS can transforms styles in any syntax, not only in CSS.

0 commit comments

Comments
 (0)