Added PostCSS to the build tree

Author: adambullmer

lib/angular-app.js

@@ -7,6 +7,10 @@ const Funnel        = require('broccoli-funnel'),
     htmlMinify      = require('broccoli-htmlmin'),
     liveReload      = require('broccoli-inject-livereload'),
     eslint          = require('broccoli-lint-eslint'),
+    postcss         = require('broccoli-postcss'),
+    postcssReporter = require('postcss-reporter'),
+    imageInliner    = require('postcss-image-inliner'),
+    autoprefixer    = require('autoprefixer'),
     csslint         = require('broccoli-csslint'),
     uglifyJs        = require('broccoli-uglify-js'),
     imagemin        = require('broccoli-imagemin'),
@@ -392,6 +396,27 @@ AngularApp.prototype.toTree = function () {
         annotation: 'Less: App Styles'
     });
 
+    appStyles = postcss(appStyles, {
+        plugins: [
+            { module: autoprefixer },
+            {
+                module: imageInliner,
+                options: {
+                    assetPaths: [
+                        '.'
+                    ]
+                }
+            },
+            {
+                module: postcssReporter,
+                options: {
+                    clearMessages: true,
+                }
+            },
+        ],
+        map: false
+    });
+
     lintingResults = this.runLinter(appScripts, appStyles);
 
     appScripts = babel(mergeTrees([appScripts, templates]));

package.json

@@ -25,6 +25,7 @@
   },
   "homepage": "https://github.com/adambullmer/angular-bro-app#readme",
   "dependencies": {
+    "autoprefixer": "^6.7.7",
     "babel-plugin-transform-es2015-modules-amd": "^6.24.1",
     "broccoli-amd-loader": "^0.1.0",
     "broccoli-angular-templates-cache": "^1.0.3",
@@ -43,6 +44,7 @@
     "broccoli-livereload-middleware": "0.1.1",
     "broccoli-merge-trees": "^1.1.1",
     "broccoli-ng-annotate": "^2.0.0",
+    "broccoli-postcss": "^3.3.0",
     "broccoli-uglify-js": "^0.1.3",
     "broccoli-wrap": "0.0.2",
     "chalk": "^1.1.3",
@@ -54,7 +56,9 @@
     "karma-jasmine": "^0.3.8",
     "karma-jasmine-html-reporter": "^0.2.0",
     "karma-phantomjs-launcher": "^1.0.0",
-    "lodash": "^4.6.1"
+    "lodash": "^4.6.1",
+    "postcss-image-inliner": "^1.0.6",
+    "postcss-reporter": "^3.0.0"
   },
   "devDependencies": {
     "eslint": "^3.18.0"