LiveReload server for monitoring files and automatically reloading web browsers
—
Pending
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Pending
The risk profile of this skill
Core LiveReload server operations including WebSocket management, browser communication, and lifecycle control.
Creates a new LiveReload server instance with configuration options.
/**
* Creates a LiveReload server instance
* @param config - Optional configuration object
* @param callback - Optional callback executed when server starts listening
* @returns Server instance extending EventEmitter
*/
function createServer(config = {}, callback) {
// Internal implementation creates HTTP/HTTPS server and WebSocket server
// Applies configuration defaults and validates options
// Returns Server instance
}Usage Examples:
const livereload = require('livereload');
// Basic server with defaults
const server = livereload.createServer();
// Server with custom port and debug
const server = livereload.createServer({
port: 8080,
debug: true
});
// Server with callback
const server = livereload.createServer({
port: 35729
}, () => {
console.log('LiveReload server is listening');
});
// HTTPS server
const fs = require('fs');
const server = livereload.createServer({
https: {
key: fs.readFileSync('server.key'),
cert: fs.readFileSync('server.crt')
}
});
// Server with CSS and image live reload
const server = livereload.createServer({
applyCSSLive: true, // Reload CSS without full page refresh (default: true)
applyImgLive: true // Reload images without full page refresh (default: true)
});Starts the WebSocket server and begins accepting browser connections.
/**
* Start the WebSocket server and begin listening for connections
* @param callback - Optional callback called when server starts listening
*/
listen(callback) {
// Starts WebSocket server on configured port/host
// Sets up connection, close, and error event handlers
// Calls callback when ready to accept connections
}Usage Examples:
const server = livereload.createServer({ noListen: true });
// Start listening manually
server.listen(() => {
console.log('Server is now listening for connections');
});
// Start listening without callback
server.listen();Monitors file system paths for changes and triggers browser reloads.
/**
* Start watching file system paths for changes
* @param paths - File path(s) or glob patterns to watch
*/
watch(paths) {
// Uses chokidar to monitor file system changes
// Applies configured exclusions and extensions filtering
// Triggers refresh() when relevant files change
}Usage Examples:
// Watch single directory
server.watch(__dirname + '/public');
// Watch multiple directories
server.watch([
__dirname + '/public',
__dirname + '/assets'
]);
// Watch specific files with glob patterns
server.watch([
'./src/**/*.js',
'./styles/**/*.css'
]);Sends reload commands to all connected browsers.
/**
* Send reload command to all connected browsers
* @param filepath - Path of the changed file
*/
refresh(filepath) {
// Constructs reload message with file path and configuration
// Sends WebSocket message to all connected clients
// Applies CSS live reload settings if applicable
}Usage Examples:
// Manually trigger a refresh
server.refresh('/path/to/changed/file.css');
// Refresh is typically called automatically by file watcher
// But can be triggered programmatically when neededSends alert messages to all connected browsers.
/**
* Send alert message to all connected browsers
* @param message - Alert message to display
*/
alert(message) {
// Sends alert command via WebSocket to all connected clients
// Message appears as browser alert dialog
}Usage Examples:
// Send alert to browsers
server.alert('Build completed successfully!');
server.alert('Compilation error in main.js');Closes file watchers and shuts down the WebSocket server.
/**
* Stop file watching and close WebSocket server
*/
close() {
// Closes chokidar file watcher if active
// Shuts down WebSocket server and underlying HTTP server
// Cleanup of all resources and connections
}Usage Examples:
// Graceful shutdown
process.on('SIGINT', () => {
console.log('Shutting down LiveReload server...');
server.close();
process.exit(0);
});
// Close server programmatically
server.close();The Server extends EventEmitter and emits events for error handling.
/**
* Server events
*/
// Error event - emitted when server encounters errors
server.on('error', (err) => {
// Handle server errors (port in use, WebSocket errors, etc.)
});Usage Examples:
const server = livereload.createServer();
// Handle server errors
server.on('error', (err) => {
if (err.code === 'EADDRINUSE') {
console.log('Port is already in use');
process.exit(1);
} else {
console.error('LiveReload server error:', err);
}
});
server.watch('./public');The server handles WebSocket protocol handshake automatically:
The server sends these message types to browsers:
const express = require('express');
const livereload = require('livereload');
const app = express();
const server = livereload.createServer();
app.use(express.static('public'));
app.listen(3000);
// Watch the public directory
server.watch(__dirname + '/public');const livereload = require('livereload');
// Create server with delay for build processes
const server = livereload.createServer({
delay: 1000, // Wait 1 second after file change
debug: true
});
// Watch source and output directories
server.watch(['./src', './dist']);
// Manual refresh after build completion
function onBuildComplete() {
server.refresh('./dist/bundle.js');
}