I’m used to building a asset compilation system with Grunt or Gulp. Using Gulp’s livereload and the Chrome livereload plugin, I have a pretty sweet system where it watches for changes of certain files and reloads only those files. With ember-cli, when I change a CSS file, it just reloads the entire page, rather than just reloading the CSS file. This gets to be a pain when I’m trying to style a deeply nested process 
Any ideas/thoughts on how to get this working with Ember CLI correctly?
You might be able to hack or configure the broccoli file to only process what you want. Not sure the specifics . You might need to comment out some of it, and setup custom trees to only process your styles.
This is currently a limitation from broccoli. There is no way to get around it unless you want to mess with ember-cli internals.
Just incase you do want to mess it the internals, here’s some hint on what to look for.
broccoli is built around 2 key modules: builder.js and watcher.js. builder takes a broccoli tree and recursively process each tree node. watcher watches source tree for changes and trigger build on the builder. For each readTree that you call, the watcher will add it to the list of things that it will watch.
The watcher will emit a change event every time a build is triggered and finished. The change event will pass along a tree graph that you can use to figure out exactly which subtree was changed and decide what to do with it.
While waiting for the issue to be fixed, I ended up wrapping ember-cli with Grunt, and then configuring Grunt to do the livereloading of my app.css. You can find more on my Stack Oveflow answer here. Hope this helps!
Official support is in the works, meanwhile try this ember-addon ember-cli-styles-reloader - npm