Sass not compiling

Ionic Framework ionic-v3
1

I created an ionic 2 blank app via cli - and it appears my sass changes are not being compiled as css.

It appears ionic 2 doesn’t support gulp anymore, so any references to using ionic setup sass isn’t working.

Running ionic build recompiles the sass, but this is an expensive process.

My current ionic.config.json file looks like this -

  "name": "my-ionic-app",
  "app_id": "",
  "v2": true,
  "typescript": true,
  "gulpStartupTasks": [
    "sass",
    "watch"
  ],
  "watchPatterns": [
    "www/**/*",
    "!www/lib/**/*",
    "!www/**/*.map",
  ]
}

Which begs the question if gulp isnt supported anymore (I dont have a gulp file in the cli process) -why is there a gulp StartupTasks block?

2

What does your .scss file look like, as well as your .ts file?

3

I’m using ionic@2.2.3 - macosx sierra 10.12.4.

my-ionic-app {
    
    ion-slides.my-ion-slides.slides.slides-md.slides-0  {
        height: initial !important;
    }

}

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, Slides } from 'ionic-angular';

@IonicPage()
@Component({
  selector: 'my-ionic-app',
  templateUrl: 'my-ionic-app.html',
})
export class MyIonicApp {
  
  @ViewChild(Slides) slides: Slides;

  constructor(public navCtrl: NavController, public navParams: NavParams) {
    console.log(this.navParams, this.slides);
  }

}
4

So I believe there are a combination of reasons why this didn’t work.

First, I created a blank ionic template and then added ionic-angular dependencies to it. Slides was one of them. I have since added the ionic-angular cli to the project, and upgraded both the ionic and angular clis to @latest and everything seems to work out of the box now.

I am now able to modify sass, and it now compiles automatically into css.