mirror of
https://github.com/Shopify/liquid.git
synced 2026-09-16 01:10:41 -07:00
Set up Grunt
Fixing up Grunt file to watch for directories Exclude node modules folder from Jekyll built site
This commit is contained in:
+55
@@ -0,0 +1,55 @@
|
||||
# grunt-postcss
|
||||
[](https://travis-ci.org/nDmitry/grunt-postcss)
|
||||
[](https://david-dm.org/nDmitry/grunt-postcss)
|
||||
|
||||
> Apply several post-processors to your CSS using [PostCSS](https://github.com/postcss/postcss).
|
||||
|
||||
## Getting Started
|
||||
This plugin requires Grunt `~0.4.0`
|
||||
|
||||
If you haven't used [Grunt](http://gruntjs.com/) before, be sure to check out the [Getting Started](http://gruntjs.com/getting-started) guide, as it explains how to create a [Gruntfile](http://gruntjs.com/sample-gruntfile) as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
|
||||
|
||||
```shell
|
||||
npm install grunt-postcss --save-dev
|
||||
```
|
||||
|
||||
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
|
||||
|
||||
```js
|
||||
grunt.loadNpmTasks('grunt-postcss');
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
```
|
||||
$ npm install grunt-postcss autoprefixer-core csswring
|
||||
```
|
||||
|
||||
```js
|
||||
grunt.initConfig({
|
||||
postcss: {
|
||||
options: {
|
||||
map: true,
|
||||
processors: [
|
||||
require('autoprefixer-core')({browsers: 'last 1 version'}).postcss,
|
||||
require('csswring').postcss
|
||||
]
|
||||
},
|
||||
dist: {
|
||||
src: 'css/*.css'
|
||||
}
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
The usage and options are similar with [grunt-autoprefixer](https://github.com/nDmitry/grunt-autoprefixer#options) (except `browsers` option). The only new option is:
|
||||
|
||||
#### options.processors
|
||||
Type: `Array`
|
||||
Default value: `[]`
|
||||
|
||||
An array of PostCSS compatible post-processors.
|
||||
|
||||
## Why would I use this?
|
||||
|
||||
Unlike the traditional approach with separate plugins, grunt-postcss allows you to parse and save CSS only once applying all post-processors in memory and thus reducing your build time. PostCSS is also a simple tool for writing your own CSS post-processors.
|
||||
Reference in New Issue
Block a user