Adds support for postcss-cli style function config

package.json

@@ -20,7 +20,7 @@
     "test.watch": "jest --watch"
   },
   "dependencies": {
-    "postcss": "6.0.20"
+    "postcss": "^7.0.16"
   },
   "devDependencies": {
     "@types/jest": "^22.2.0",

src/declarations.ts

@@ -1,3 +1,5 @@
+import { ProcessOptions } from 'postcss';
+
 export interface PluginOptions {
   injectGlobalPaths?: string[];
   plugins?: Array<any>;
@@ -8,11 +10,17 @@ export interface PluginTransformResults {
   id?: string;
 }
 
-export interface RendererOptions {
+export interface RendererOptions extends ProcessOptions {
   data: string;
   plugins: Array<any>;
 }
 
+export interface RendererCtx {
+  env?: string;
+  file?: string;
+  options?: ProcessOptions;
+}
+
 export interface PluginCtx {
   config: {
     rootDir?: string;

src/index.ts

@@ -3,12 +3,19 @@ import { loadDiagnostic } from './diagnostics';
 import * as d from './declarations';
 import * as util from './util';
 
-
-export function postcss(opts: d.PluginOptions = {}) {
-
+export function postcss(
+  opts: ((ctx: d.RendererCtx) => d.PluginOptions) | d.PluginOptions = {}
+) {
   return {
     name: 'postcss',
     transform(sourceText: string, fileName: string, context: d.PluginCtx) {
+      if (typeof opts === 'function') {
+        opts = opts({
+          env: process.env.NODE_ENV,
+          file: fileName
+        });
+      }
+
       if (!opts.hasOwnProperty('plugins') || opts.plugins.length < 1) {
         return null;
       }
@@ -29,7 +36,6 @@ export function postcss(opts: d.PluginOptions = {}) {
       }
 
       return new Promise<d.PluginTransformResults>(resolve => {
-
         postCss(renderOpts.plugins)
           .process(renderOpts.data, {
             from: fileName
@@ -52,7 +58,9 @@ export function postcss(opts: d.PluginOptions = {}) {
 
               const mappedWarnings = warnings
                 .map((warn: any) => {
-                  return `${warn.type} ${warn.plugin ? `(${warn.plugin})` : ''}: ${warn.text}`;
+                  return `${warn.type} ${
+                    warn.plugin ? `(${warn.plugin})` : ''
+                  }: ${warn.text}`;
                 })
                 .join(', ');
 
@@ -64,16 +72,20 @@ export function postcss(opts: d.PluginOptions = {}) {
               // write this css content to memory only so it can be referenced
               // later by other plugins (autoprefixer)
               // but no need to actually write to disk
-              context.fs.writeFile(results.id, results.code, { inMemoryOnly: true }).then(() => {
-                resolve(results);
-              });
+              context.fs
+                .writeFile(results.id, results.code, { inMemoryOnly: true })
+                .then(() => {
+                  resolve(results);
+                });
             }
 
             return results;
           })
           .catch((err: any) => {
             loadDiagnostic(context, err, fileName);
-            results.code = `/**  postcss error${err && err.message ? ': ' + err.message : ''}  **/`;
+            results.code = `/**  postcss error${
+              err && err.message ? ': ' + err.message : ''
+            }  **/`;
             resolve(results);
           });
       });

src/util.ts

@@ -1,39 +1,48 @@
 import * as d from './declarations';
 import * as path from 'path';
 
-
 export function usePlugin(fileName: string) {
   return /(\.css|\.pcss)$/i.test(fileName);
 }
 
-export function getRenderOptions(opts: d.PluginOptions, sourceText: string, context: d.PluginCtx) {
+export function getRenderOptions(
+  opts: d.PluginOptions,
+  sourceText: string,
+  context: d.PluginCtx
+) {
   const renderOpts: Partial<d.RendererOptions> = {
     plugins: opts.plugins || []
   };
 
-  // always set "data" from the source text
+  // always set 'data' from the source text
   renderOpts.data = sourceText || '';
 
-  const injectGlobalPaths = Array.isArray(opts.injectGlobalPaths) ? opts.injectGlobalPaths.slice() : [];
+  const injectGlobalPaths = Array.isArray(opts.injectGlobalPaths)
+    ? opts.injectGlobalPaths.slice()
+    : [];
 
   if (injectGlobalPaths.length > 0) {
     // automatically inject each of these paths into the source text
-    const injectText = injectGlobalPaths.map(injectGlobalPath => {
-      if (!path.isAbsolute(injectGlobalPath)) {
-        // convert any relative paths to absolute paths relative to the project root
-        injectGlobalPath = path.join(context.config.rootDir, injectGlobalPath);
-      }
-
-      return `@import "${injectGlobalPath}";`;
-    }).join('');
+    const injectText = injectGlobalPaths
+      .map(injectGlobalPath => {
+        if (!path.isAbsolute(injectGlobalPath)) {
+          // convert any relative paths to absolute paths relative to the project root
+          injectGlobalPath = path.join(
+            context.config.rootDir,
+            injectGlobalPath
+          );
+        }
+
+        return `@import "${injectGlobalPath}";`;
+      })
+      .join('');
 
     renderOpts.data = injectText + renderOpts.data;
   }
 
   return renderOpts;
 }
 
-
 export function createResultsId(fileName: string) {
   // create what the new path is post transform (.css)
   const pathParts = fileName.split('.');

tsconfig.json

@@ -5,9 +5,7 @@
     "alwaysStrict": true,
     "declaration": true,
     "forceConsistentCasingInFileNames": true,
-    "lib": [
-      "es2017"
-    ],
+    "lib": ["es2017"],
     "module": "es2015",
     "moduleResolution": "node",
     "noImplicitAny": true,
@@ -19,7 +17,5 @@
     "removeComments": false,
     "target": "es2015"
   },
-  "files": [
-    "src/index.ts"
-  ]
+  "files": ["src/index.ts"]
 }