Live reload injects CSS but still does full page refresh anyway

[craigmdennis]

The CSS is injected correctly but then the page refreshes.

gem 'middleman', '~> 4.1'
gem 'middleman-sprockets', '~> 4.0.0.rc'
gem 'middleman-livereload'

When changing an .scss file, livereload attempts to reload that file as well as the compiled file. This is output to the terminal window:

== LiveReloading path: /Sites/myproject/assets/css/components/_panels.scss
== LiveReloading path: /assets/css/app.css

This is from my config file:

configure :development do
  activate :livereload do |live|
    live.livereload_css_target = "assets/css/app.css"
  end
end

# Directories
set :css_dir, "assets/css"
set :js_dir, "assets/js"
set :images_dir, "assets/images"

[andrewcroce]

I'm getting the same issue, near identical setup.

[sandstrom]

I've had some success with this (using it along with the external pipeline):

  activate :livereload,
    :no_swf => true,
    :ignore => [/\.html$/],
    :livereload_css_pattern => Regexp.new('.+\.scss$'),
    :livereload_css_target => '/css/all.css' # will vary between projects

This gives me live-reloading of only CSS. I still need to hit F5 for html-reloads, but since most minor changes are CSS-only I find this tradeoff worthwhile.

[danenania]

For anyone needing a hack just to get this working and who doesn't need full page refreshes at all, putting the following javascript at the bottom of the body (in development only) does the trick for me. I wasn't able to accomplish it through just the activate call.

LiveReload.reloader.reloadPage = function(){}

Css reloading is working well like this, my js reloading is handled outside of middleman, and I'm working on an SPA with a single static index.html that rarely changes, so no need for reloads based on html either. Ymmv of course--I'd imagine this could be turned into a fancier hack for differentiating based on the file type, or even better, controlled via activate params.