serve-dev

ZEIT's serve remade with auto-reloading and GNU Make rebuilding.

Install

npm i @jamen/serve-dev

Usage

serve-dev [public] [options]

Starts a static file serve with optional rebuilding and auto-reloading.

The available options are:

• --listen <listen_uri> Specifies where the server listens from. Its the same as serve.
• --config <path> Loads a JSON file of serve-handler options.
• --watch <pattern> A file, directory, or glob pattern where the server watches files.
• --make <target> A make target that corrosponds to a watcher.
• --https Enables HTTPS. Uses --key and --cert.
• --program <name> Use something other than make for building.
• --reload <path> The server endpoint where reload events are pushed.

Auto-reloading

In order for auto-reloading to work, your application needs to support it. This is demonstrated below with simple code.

// Receive a reload
const src = new EventSource('/__reload')

// Call the reload
src.onmessage = () => window.location.reload()

However, this is probably too simple. Here is another one that fixes a bug with Firefox and adds reconnecting.

connect()

function connect () {
    let src

    try {
        src = new EventSource('/__reload')
    } catch (error) {
        // Retry connection every 5 seconds
        setTimeout(() => connect(), 5000)
    }

    if (src && src.readyState < 2) {
        // Call the reload
        src.onmessage = () => window.location.reload()

        // Fix bug with Firefox, close EventSource just before page reloads
        window.addEventListener('beforeunload', () => {
            if (src && src.readyState < 2) {
                src.close()
            }
        })
    }
}