Ember livereload not working when scss file updated in pod structure

I have the following structure:

app/
  pods/
    components/
      user-login/
        component.js
        style.scss
        template.hbs

Template files and component files livereload correctly, however, when I save changes to my style files in Atom the changes are not applied on the webpage- they are only applied when I kill and rerun:

ember server

and reload the webpage. I have installed the following:

ember-cli-styles-reloader

and I have tried adding:

"liveReload": true,
"watcher": "polling"

to:

.ember-cli

and I also tried adding these options to:

ember-cli-build.js

inside the app variable.

What am I missing?

There is a better option I believe, and I recommend to do this way:

First install ember-cli-sass-pods addon that uses ember-cli-sass (will install automatically) and then generate your style scss files into your pods directories.

to install

ember install ember-cli-sass-pods

then add

  var app = new EmberApp(defaults, {

    // you must add Watched folder to your Ember-Cli-Build.js
    sassOptions: {
      includePaths: ['app']
    }

  });

For example:

app/components/user-login
app/components/user-login/component.js
app/components/user-login/template.hbs
app/components/user-login/style.scss

just simply run this command:

ember g style [path] -p //your path now is components/user-login

there are more options that you can read their documents

You are ,after installing and setting up that, able to use ember-cli-styles-reloader which probably will work smoothly. make sure you have followed all the rules that they mentioned in their documents to set up ember-cli-styles-reloader.