search

sculpin / sculpin

Sculpin — Static Site Generator
https://sculpin.io
MIT License
1.46k stars 194 forks source link

Live reload web site when --watch enabled #217

Open jsundquist opened 9 years ago

jsundquist commented 9 years ago

Right now when you run sculpin generate --server --watch you have to manually refresh the page. It would be great if when using the watch flag sculpin could trigger your page to automatically reload for you. There appears to already be a php version of livereload at https://github.com/RickySu/php-livereload.

WyriHaximus commented 9 years ago

My thoughts about this go a bit further then just using livereload. Instead of reloading the entire page I was thinking about just refreshing the content that was updated. Thus instead of reloading a page only reloading the content of the post that was updated. Now while writing that I realize that it would involve a lot of hooking into the content and making things rather complex. Because for a post you just updated the post content but for an theme/layout change you still have to reload the entire page. So I'm :+1: for using livereload to just reload the entire page if it changes.

jsundquist commented 9 years ago

The other thing to keep in mind. People don't use Sculpin for just blogging. For instance, the entire Midwest PHP web site is written using sculpin. :-) So its best to update the entire site.

WyriHaximus commented 9 years ago

You're absolutely right, after rethinking it all live reload the entire page is the way to go :+1:

ebsen commented 9 years ago

When you get around to this, take a look at Browsersync. It offers a simpler, more flexible API and a more robust feature set, including an admin panel that provides some great in-browser debugging and a public, live-reloaded development URL. This lets me share a URL to coworkers to review while we code—super handy.

I first learned of the tool through its inclusion with Google Starter Kit and in the time since, the Yeoman generators I use have all switched over to it.

Incognito commented 9 years ago

You may be able to write a reloader that is configurable, so if changes are detected than simply trigger a reload to some endpoint... however... you're adding in a lot of JS that's specific to your use case, and I'm not confident it can scale out. This might be an amazing development plugin but I don't see a clean way to use it for anything except very specific use cases when you want to regenerate specific content.

Doing the entire page is more straight forward, and we can possibly pull in the code someone else has made for that job. https://github.com/livereload/livereload-js

ebsen commented 9 years ago

Browsersync and LiveReload do the same thing. Browsersync just does it more helpfully, IMO.

Both are added to the development page via JavaScript and both reload the entire page when a change occurs to a certain file type.

Browsersync can also inject certain changes into the page so that CSS changes appear without a full refresh. This is better for testing things like menus or drop-downs that depend on state because you don't need to then do all the clicks again to get back to that certain UI state.

Currently I just run Browsersync in proxy mode in a separate Terminal tab and with no modifications to Sculpin. I guess I don't see what makes Browsersync any more (or even different) to implement than LiveReload.

ebsen commented 8 years ago

Hey. I want to apologize about my attitude above. They're just tools; I did not need to be so rude about them.

Sorry, everyone.

davedevelopment commented 8 years ago

@ebsen Sorry I meant to comment earlier, but double checked to see if there was something out of band that I missed... I don't think you need to apologise for anything, I certainly didn't take offence to anything you said.

opdavies commented 6 years ago

+1 for this feature.

dannybrown73 commented 6 years ago

+1 for this feature.

agbottan commented 6 years ago

+1 for this feature.

beryllium commented 6 years ago

Jonathan Wage recently blogged about an approach he took to work around this issue (and also to make Sculpin work nicely with github pages in Project Mode using the docs subfolder approach) - this approach might be helpful in the near-term until someone can add it to sculpin itself:

https://jwage.com/posts/2018/03/25/sculpin-watch-rebuild/

opdavies commented 5 years ago

@beryllium Maybe another one to move to https://github.com/sculpin/sculpin-blog-skeleton, where we could maybe use Browsersync or similar within Encore?

beryllium commented 5 years ago

Actually, this is one that I'd like to leave in "sculpin proper", because I think portions of it could be accomplished in a way that benefits users of many sculpin configurations. I have a couple of branches I'm working on which have functionality like Live Editing and Live Reloading injected into the generate output when in --server mode. Leaving open for now.

ahillio commented 3 years ago

It would be so great if Sculpin worked out-of-the-box with BrowserSync. I've got a Sculpin starterkit working on localhost:8000 and following the basic instructions for browser-sync on localhost:3000 but that never loads. It would be so wonderful if this was provided out of the box.

In this instance, the command to get browsersync working would be browser-sync start --proxy "localhost:8000" --files source/*. Fortunately it wasn't that hard and painful.