How to use SASS correctly?

[ghost]

I wonder how to setup SASS in my project correctly. This is my app/styles/main.scss:

$positive: #0A4F7C !default;
@import "../bower_components/ionic/scss/ionic.scss";

It works fine. Though I want to minimize the data's footprint. That is why I wonder:

1. How to safely remove bower_components/ionic/release/css/ionic.css, since if I delete that in my index.html e.g. icons are not working.

2. How to minify the freshly generated styles/main.css file? Shouldn't that be built in as a feature in generator-ionic?

BTW: generator-ionic is great!

[oori]

(1) My solution was to bypass ionic.css from wiredep, so the "original" ionic.css doesn't load.
The cleanest way (I know of) to do it is via bower.json:

  "overrides": {
    "ionic": {
      "main": [
        "release/fonts/*",
        "release/js/ionic.js",
        "release/js/ionic-angular.js"
      ]
    }
  }

(2) minifcation is handled by the build. assuming your index.html has this:

    <!-- build:css({.temp,app}) styles/main.css -->
    <link rel="stylesheet" href="styles/main.css">
    <!-- endbuild -->