CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-live-server

A development HTTP server with automatic live reload functionality for front-end web development

—

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

cli.mddocs/

Command Line Interface

Complete command-line interface for Live Server providing quick development server setup with extensive configuration options.

Capabilities

Basic Server Command

Start a live development server from the command line.

live-server [PATH] [OPTIONS]

# PATH: Optional directory to serve (defaults to current directory)

Usage Examples:

# Serve current directory on default port 8080
live-server

# Serve specific directory
live-server /path/to/project
live-server ./dist
live-server ../my-website

# Serve current directory with custom configuration
live-server --port=3000 --host=localhost

Server Configuration Options

Configure server binding and behavior.

--port=NUMBER          # Set server port (default: PORT env var or 8080)
--host=ADDRESS         # Set host address (default: IP env var or 0.0.0.0)
--wait=MILLISECONDS    # Wait time before reloading (default: 100ms)
--quiet | -q           # Suppress logging (logLevel: 0)  
--verbose | -V         # Enable verbose logging (logLevel: 3)

Usage Examples:

# Custom port and host
live-server --port=3000 --host=127.0.0.1

# Random available port
live-server --port=0

# Reduce reload frequency
live-server --wait=500

# Quiet mode for automated scripts
live-server --quiet

# Verbose mode for debugging
live-server --verbose

Browser Control Options

Control automatic browser launching and initial page.

--no-browser           # Suppress automatic browser launching
--browser=BROWSER      # Specify browser to use (comma-separated list)
--open=PATH            # Launch browser to specific path instead of root

Usage Examples:

# Don't launch browser automatically
live-server --no-browser

# Use specific browser
live-server --browser=firefox
live-server --browser="google chrome"

# Open specific page
live-server --open=/dashboard
live-server --open=/admin/login

# Multiple pages
live-server --open=/page1 --open=/page2

# Use Chrome in incognito mode
live-server --browser="google chrome --incognito"

File Watching Options

Configure which files to watch and ignore for live reload.

--watch=PATH          # Comma-separated paths to exclusively watch
--ignore=PATH         # Comma-separated paths to ignore  
--ignorePattern=RGXP  # Regular expression to ignore files (DEPRECATED)
--no-css-inject       # Reload page on CSS changes instead of injecting

Usage Examples:

# Watch only specific directories
live-server --watch=src,public

# Ignore specific paths
live-server --ignore=node_modules,*.log,temp

# Ignore pattern (deprecated - use --ignore instead)
live-server --ignorePattern='.*\\.tmp$'

# Disable CSS injection - reload page on CSS changes
live-server --no-css-inject

Single Page Application (SPA) Support

Configure server for Single Page Applications with client-side routing.

--spa                 # Enable SPA mode (redirect /path to /#/path)
--entry-file=PATH     # Serve specific file for 404s (SPA fallback)

Usage Examples:

# Basic SPA mode - redirects to hash URLs
live-server --spa

# Serve index.html for all unmatched routes (common SPA pattern) 
live-server --entry-file=index.html

# Serve app.html as fallback
live-server --entry-file=dist/app.html

# Combine SPA mode with entry file
live-server --spa --entry-file=index.html

Advanced Routing and Proxying

Configure directory mounting and request proxying.

--mount=ROUTE:PATH    # Mount directory to specific route
--proxy=ROUTE:URL     # Proxy requests from route to URL

Usage Examples:

# Mount node_modules to /vendor route
live-server --mount=/vendor:./node_modules

# Mount multiple directories
live-server --mount=/components:./lib --mount=/assets:./static

# Proxy API requests to backend
live-server --proxy=/api:http://localhost:3001

# Proxy with full URL
live-server --proxy=/graphql:https://api.example.com/graphql

# Complex setup with mounting and proxying
live-server --mount=/static:./dist --proxy=/api:http://localhost:8000

Security and Authentication

Configure HTTPS and HTTP Basic Authentication.

--https=PATH          # Path to HTTPS configuration module
--https-module=NAME   # Custom HTTPS module (e.g., 'spdy' for HTTP/2)
--htpasswd=PATH       # Path to htpasswd file for Basic Auth
--cors                # Enable CORS for any origin

Usage Examples:

# HTTPS with configuration file
live-server --https=./ssl-config.js

# HTTPS with HTTP/2 using spdy module
live-server --https=./ssl-config.js --https-module=spdy

# HTTP Basic Authentication
live-server --htpasswd=./users.htpasswd

# Enable CORS for cross-origin requests
live-server --cors

# Complete secure setup
live-server --https=./ssl.js --htpasswd=./auth --cors

Example HTTPS configuration file (ssl-config.js):

const fs = require("fs");

module.exports = {
  cert: fs.readFileSync(__dirname + "/server.cert"),
  key: fs.readFileSync(__dirname + "/server.key"),
  passphrase: "optional-passphrase"
};

Middleware Integration

Add custom Connect-compatible middleware to the server stack.

--middleware=PATH     # Path to .js file exporting middleware function

Usage Examples:

# Add custom middleware
live-server --middleware=./custom-middleware.js

# Use built-in middleware by name
live-server --middleware=spa

# Multiple middleware (order matters)
live-server --middleware=cors --middleware=./auth.js

Built-in middleware available by name:

  • spa - Redirect routes to hash URLs
  • spa-ignore-assets - SPA middleware that redirects routes to hash URLs except for requests with file extensions
  • example - Example middleware (sets status 202)

Example custom middleware file:

module.exports = function(req, res, next) {
  // Add custom headers
  res.setHeader('X-Custom-Header', 'live-server');
  
  // Log requests
  console.log(`${req.method} ${req.url}`);
  
  next();
};

Configuration File Support

Use configuration file for default options.

# Configuration loaded from ~/.live-server.json

Example ~/.live-server.json:

{
  "port": 3000,
  "host": "localhost", 
  "open": false,
  "logLevel": 1,
  "ignore": ["node_modules", "*.log"],
  "middleware": ["cors"]
}

Help and Version Information

Get help and version information.

--help | -h           # Display usage help and exit
--version | -v        # Display version and exit

Usage Examples:

# Show help
live-server --help
live-server -h

# Show version
live-server --version
live-server -v

Environment Variables

Environment variables that affect default behavior.

PORT                  # Default port if --port not specified
IP                    # Default host if --host not specified

Usage Examples:

# Set defaults via environment
PORT=3000 IP=localhost live-server

# Override environment with command line
PORT=3000 live-server --port=4000  # Uses port 4000

Complete Command Examples

Common real-world usage patterns:

# Development server for React/Vue SPA
live-server dist --spa --port=3000 --open=/

# Development with API proxy
live-server public --proxy=/api:http://localhost:8080 --cors

# HTTPS development server
live-server --https=./dev-ssl.js --port=8443

# Production-like testing with authentication
live-server dist --htpasswd=./users --no-css-inject --quiet

# Complex development setup
live-server src \
  --port=3000 \
  --proxy=/api:http://localhost:8000 \
  --mount=/vendor:./node_modules \
  --middleware=./dev-middleware.js \
  --spa \
  --cors \
  --verbose

docs

cli.md

index.md

nodejs-api.md

tile.json