Added PostCSS to the build tree

adambullmer · Mar 31, 2017 · 8b74095 · 8b74095
1 parent ccb25ee
commit 8b74095
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 3 deletions.
diff --git a/lib/angular-app.js b/lib/angular-app.js
@@ -1,4 +1,4 @@
-const Funnel          = require('broccoli-funnel'),
+const Funnel        = require('broccoli-funnel'),
     concat          = require('broccoli-concat'),
     less            = require('broccoli-less-single'),
     mergeTrees      = require('broccoli-merge-trees'),
@@ -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'),
@@ -395,6 +399,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 = new Babel(mergeTrees([appScripts, templates]), {

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-bro-app",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "Angular broccoli plugin and compilation routine",
   "main": "lib/angular-app.js",
   "scripts": {
@@ -26,6 +26,7 @@
   "homepage": "https://github.com/adambullmer/angular-bro-app#readme",
   "dependencies": {
     "amd-name-resolver": "0.0.5",
+    "autoprefixer": "^6.7.7",
     "broccoli-amd-loader": "^0.1.0",
     "broccoli-angular-templates-cache": "^1.0.3",
     "broccoli-asset-rev": "^2.4.2",
@@ -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"