Skip to content

Commit c140d4b

Browse files
committed
Update README
1 parent 7cb2614 commit c140d4b

File tree

1 file changed

+53
-44
lines changed

1 file changed

+53
-44
lines changed

README.md

Lines changed: 53 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,89 +1,98 @@
11
# laravel-elixir-postcss
2-
(Support for Elixir V6) Laravel Elixir PostCSS Extension.
2+
[![Build Status](https://travis-ci.org/tureki/laravel-elixir-postcss.svg?branch=master)](https://travis-ci.org/tureki/laravel-elixir-postcss)
3+
[![npm Version](https://img.shields.io/npm/v/laravel-elixir-postcss.svg)](https://www.npmjs.com/package/laravel-elixir-postcss)
4+
[![npm License](https://img.shields.io/npm/l/laravel-elixir-postcss.svg)](https://www.npmjs.com/package/laravel-elixir-postcss)
35

6+
This Laravel Elixir extension allows you easy to compile PostCSS.
47

5-
## Install
8+
If this package helpful and save your time. Do not forget star it :)
69

7-
```sh
10+
11+
## Installation
12+
13+
```bash
814
$ npm install laravel-elixir-postcss --save-dev
915
```
1016

1117

1218
## Usage
1319

1420
```javascript
15-
16-
elixir.postcss(src:'app.css', options);
17-
21+
elixir(function(mix) {
22+
//app.css, *.css, **/*.css
23+
elixir.postcss('app.css');
24+
});
1825
```
1926

20-
Example:
27+
#### Using PostCSS Plugins
2128

2229
```javascript
23-
24-
var elixir = require('laravel-elixir');
25-
26-
require('laravel-elixir-postcss');
27-
2830
elixir(function(mix) {
29-
30-
//app.css, *.css, **/*.css
3131
mix.postcss('app.css', {
32-
plugins:[ //postcss's plugins
32+
plugins:[
3333
require('postcss-nested')
34-
]
34+
]
3535
});
36-
3736
});
38-
3937
```
4038

41-
Or run `PostCSS` with `csstyle`:
39+
#### Using Other Parser
4240

43-
```javascript
44-
45-
...
41+
You can set the [options](https://github.com/postcss/postcss#options) using other parsers like `scss`, `sugarss` etc.
4642

43+
```javascript
4744
elixir(function(mix) {
48-
4945
mix.postcss('app.css', {
50-
plugins:[
51-
require('postcss-nested'),
52-
require('csstyle')
53-
]
46+
options: {
47+
parser: require('postcss-scss')
48+
},
5449
});
55-
5650
});
51+
```
5752

53+
Use `parser` and `plugins`.
54+
```javascript
55+
elixir(function(mix) {
56+
mix.postcss('app.css', {
57+
options: {
58+
parser: require('sugarss')
59+
},
60+
plugins: [
61+
require('postcss-nested')
62+
],
63+
});
64+
});
5865
```
5966

60-
Then run:
6167

62-
```sh
63-
$ gulp
64-
```
68+
## Options
69+
70+
This extension accept two parameters:
6571

66-
Or run `gulp watch`
72+
* An string of files.
73+
* An object of options.
6774

75+
Common options:
6876

69-
## Default Options
77+
* `options`: See [postcss common options](https://github.com/postcss/postcss#options).
78+
* `output`: destination's path
79+
* `plugins`: postcss's plugins.
80+
* `srcPath`: source's directory.
81+
* `sourcemaps`: enable source map.
82+
* `watchs`: additional watch directories.
7083

84+
#### Default Value
7185
```javascript
7286
{
87+
options: {},
7388
output : 'public/css',
7489
plugins : [],
75-
srcDir : 'resources/assets/postcss/',
76-
sourcemaps: true, // default value follow `elixir.config.sourcemaps`
77-
watch: [], // set additional watch directories here.
90+
srcPath : 'resources/assets/postcss/',
91+
sourcemaps: true, //default value follow `elixir.config.sourcemaps`
92+
watchs: [],
7893
}
7994
```
8095

8196

8297
## Contributing
83-
Welcome [PR](https://github.com/tureki/laravel-elixir-postcss/pulls)
84-
85-
86-
## Todo
87-
88-
1. Add Unit Test
89-
2. Integrate CI
98+
Welcome [PR](https://github.com/tureki/laravel-elixir-postcss/pulls) and play it :smile:

0 commit comments

Comments
 (0)