Merge pull request #46 from carrot/postcss-opts

Allow postcss options to be passed through

Author: Jeff Escalante

lib/config.js

@@ -30,7 +30,10 @@ export default class Config {
         css: Joi.string().default('**/*.css'),
         js: Joi.string().default('**/*.js')
       }),
-      postCssPlugins: Joi.array().default([]),
+      postcss: Joi.object().default().keys({
+        plugins: Joi.array().default([]),
+        options: Joi.object().default({})
+      }),
       babelConfig: Joi.object().default({}),
       dumpDirs: Joi.array().default(['views', 'assets']),
       locals: Joi.object().default({}),
@@ -117,16 +120,16 @@ export default class Config {
 
     this.module = {
       loaders: [
-        { test: mmToRe(opts.matchers.css), exclude: opts.ignore.map(mmToRe), loader: 'css!postcss' },
+        { test: mmToRe(opts.matchers.css), exclude: opts.ignore.map(mmToRe), loader: `css!postcss?${JSON.stringify(opts.postcss.options)}` },
         { test: mmToRe(opts.matchers.js), exclude: opts.ignore.map(mmToRe), loader: 'babel' },
-        { test: mmToRe(opts.matchers.jade), exclude: opts.ignore.map(mmToRe), loader: 'jade?pretty=true' }
+        { test: mmToRe(opts.matchers.jade), exclude: opts.ignore.map(mmToRe), loader: 'jade', query: { pretty: true } }
       ]
     }
 
     this.postcss = function (wp) {
       let res = [postcssImport({ addDependencyTo: wp })]
-      res.push(...opts.postCssPlugins)
-      return opts.postCssPlugins
+      res.push(...opts.postcss.plugins)
+      return opts.postcss.plugins
     }
 
     this.modulesDirectories = opts.modulesDirectories

readme.md

@@ -40,7 +40,7 @@ The above shows a minimal instantiation, but the constructor accepts a wide vari
 
 - **root**: An absolute path to the root of your project.
 - **matchers**: An object with `jade`, `css`, and `js` keys. Each key is a [micromatch](https://github.com/jonschlinkert/micromatch) string, and represents which files should be pulled into the pipeline to be processed. Defaults are `**/*.jade`, `**/*.css`, and `**/*.js`. Be very careful if you are trying to change this.
-- **postCssPlugins**: An array of [plugins to be passed to PostCSS](http://postcss.parts/) for CSS processing.
+- **postcss**: An object that can contain a `plugins` key, which is an array of [plugins to be passed to PostCSS](http://postcss.parts/) for CSS processing, and/or a `options` key, which takes [any of the postcss-loader options](https://github.com/postcss/postcss-loader#custom-syntaxes).
 - **babelConfig**: A [configuration object for Babel](http://babeljs.io/docs/usage/options/) for JS processing.
 - **dumpDirs**: An array of directories which, if direct children of the project root, will dump their contents to the root on compile. Defaults to `['views', 'assets']`.
 - **locals**: An object containing locals to be passed to jade views. This can be used for values, functions, any sort of view helper you need.

test/config_errors.js

@@ -8,8 +8,8 @@ test('config errors', (t) => {
     'ValidationError: child "matchers" fails because ["matchers" must be an object]')
   t.throws(() => { new Roots({ root: 'foo', matchers: { css: [1] } }) }, // eslint-disable-line
     'ValidationError: child "matchers" fails because [child "css" fails because ["css" must be a string]]')
-  t.throws(() => { new Roots({ root: 'foo', postCssPlugins: function () {} }) }, // eslint-disable-line
-    'ValidationError: child "postCssPlugins" fails because ["postCssPlugins" must be an array]')
+  t.throws(() => { new Roots({ root: 'foo', postcss: function () {} }) }, // eslint-disable-line
+    'ValidationError: child "postcss" fails because ["postcss" must be an object]')
   t.throws(() => { new Roots({ root: 'foo', babelConfig: 'wow' }) }, // eslint-disable-line
     'ValidationError: child "babelConfig" fails because ["babelConfig" must be an object]')
   t.throws(() => { new Roots({ root: 'foo', entry: ['foo', 'bar'] }) }, // eslint-disable-line