Runs commands when files change then sends an event to the client over SSE.
- Inject reload script into the client server side instead of importing it
- ESBuild outputs empty app.js files when there's a build error so the client won't auto reconnect (non-issue?)
- Refine the file extension flag syntax. ex:
--ext:js <command> --ext:css <command>
- Use http2?
Example using a makefile.
The --bang
flag runs the following command immediately after the server starts.
Flags like --js
and -scss
are flags that correlate to file extensions.
These extension flags can be anything.
reload-server \
--bang "$(MAKE) css js html" \
--scss "$(MAKE) css" \
--js "$(MAKE) js" \
--watch "src"
Include this in your JavaScript.
if (DEV === true) {
const source = new EventSource('/reload')
source.onmessage = body => {
if (body.data === 'connect') {
console.log('Connected to automatic reload')
return // stop execution
}
if (body.data === 'reload') {
window.location.reload()
return // stop execution
}
if (body.data === undefined) {
console.log('Heartbeat from automatic reload')
}
}
}