title: compass-mixins plugin not translating background-image property correctly in browser in Angular2
body: <p>I am using compass-sass-mixins version 0.12.7.
  My angular version is 2.4.3
  My background-image property is not geetting displayed on browser when I build the code.</p>
  
  <p>My <code>background-image</code> property is as follows in my global.scss file:</p>
  
  <pre><code>    body{
    background-color: rgba(44,22,78,1);
    @include filter-gradient($clr-purple, $clr-orange, vertical);
    @include background-image(linear-gradient(top, rgba(44,22,78,1) 0%, rgba(164,64,131,1) 50%, rgba(164,64,131,1) 50%, rgba(255,126,90,1) 100%));
    font-family: $font-regular;
    letter-spacing: 0.7px/$base-font-size+rem;
  }
  </code></pre>
  
  <p>Below is my package.json :</p>
  
  <pre><code>{
  "name": "rockethire",
  "version": "1.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
  "ng": "ng",
  "start": "ng serve",
  "build": "npm run clean &amp;&amp; tsc src/main.ts",
  "build_prod": "npm run build",
  "lint": "tslint "src/**/*.ts"",
  "test": "ng test",
  "clean": "rm -rf dist",
  "pree2e": "webdriver-manager update --standalone false --gecko false",
  "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
  "@ angular/common": "2.4.3",
  "@ angular/compiler": "2.4.3",
  "@ angular/core": "2.4.3",
  "@ angular/forms": "2.4.3",
  "@ angular/http": "2.4.3",
  "@ angular/material": "2.0.0-beta.1",
  "@ angular/platform-browser": "2.4.3",
  "@ angular/platform-browser-dynamic": "2.4.3",
  "@ angular/router": "3.4.3",
  "ag-grid": "^15.0.0",
  "ag-grid-angular": "^15.0.0",
  "angular-messages": "^1.6.2",
  "angular2-cookie": "^1.2.6",
  "angular2-material-datepicker": "^0.5.0",
  "angular2-perfect-scrollbar": "^2.0.3",
  "compass-sass-mixins": "^0.12.7",
  "core-js": "^2.4.1",
  "moment": "^2.17.1",
  "ng2-auto-complete": "^0.10.9",
  "ng2-pdf-viewer": "^0.1.6",
  "ng2-pop-over": "^0.9.34",
  "ng2-validation": "^4.2.0",
  "bootstrap": "^3.3.7",
  "rxjs": "^5.0.1",
  "tinymce": "^4.7.4",
  "ts-helpers": "^1.1.1",
  "underscore": "^1.8.3",
  "zone.js": "^0.7.6"
  },
  "devDependencies": {
  "@ angular/compiler-cli": "2.4.3",
  "@ types/jasmine": "2.5.38",
  "@ types/node": "^6.0.42",
  "@ types/underscore": "^1.8.6",
  "angular-cli": "1.0.0-beta.24",
  "angular2-perfect-scrollbar": "^2.0.2",
  "codelyzer": "~2.0.0-beta.1",
  "jasmine-core": "2.5.2",
  "jasmine-spec-reporter": "2.5.0",
  "karma": "1.2.0",
  "karma-chrome-launcher": "^2.0.0",
  "karma-cli": "^1.0.1",
  "karma-jasmine": "^1.0.2",
  "karma-remap-istanbul": "^0.2.1",
  "protractor": "~4.0.13",
  "ts-node": "1.2.1",
  "tslint": "^4.0.2",
  "typescript": "~2.0.3"
  },
  "description": "This project was generated with angular-cli version 1.0.0-beta.24.",
  "repository": {
  "type": "git",
  "url": "git+https://github.com/clistesoft/rockethire.git"
  },
  "author": "Rupesh rupeshv@clistesoft.com",
  "bugs": {
  "url": "https://github.com/clistesoft/rockethire/issues"
  },
  "homepage": "https://github.com/clistesoft/rockethire#readme"
  }
  </code></pre>
  
  <p>When I build the code using <code>ng build</code>,
  I get following WARNING :</p>
  
  <pre><code>PIE does not support background-image. Use @include background(linear-gradient(top, #2c164e 0%, #a44083 50%, #a44083 50%, #ff7e5a 100%)) instead.
  Backtrace:
      node_modules/compass-sass-mixins/lib/compass/css3/_images.sass:48, in mixin `background-image`
      src/_global.scss:18
  </code></pre>
  
  <p>When I add above suggested line instead of the orginal one in global.scss, the WARNING goes away but still the change is not reflected in my browser.</p>
  
  <p>Is this compass-mixins a version problem?</p>
  
  <p>Below is the screenshots how it shoud display :</p>
  
  <p><a href="https://i.stack.imgur.com/0MQ9V.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0MQ9V.png" alt="enter image description here"></a></p>
  
  <p>And below is the screenshot how it is currently displaying :</p>
  
  <p><a href="https://i.stack.imgur.com/6kuAa.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6kuAa.png" alt="enter image description here"></a></p>
  
  <p>Can not reproduce here as its currently a part of my production build.
  Can anyone help?</p>