What is serve?
The serve npm package is a static file serving and directory listing package that allows you to serve static files over HTTP quickly and easily. It is often used for hosting single-page applications, static websites, or for serving files during development.
What are serve's main functionalities?
Serving static files
This command starts a static file server in the specified directory. By default, it listens on port 5000, but you can specify another port with the -l flag.
npx serve /path/to/static/files
Directory listing
Running serve without any arguments serves the current directory and provides a directory listing if no index.html file is found.
npx serve
Single-page application mode
The -s flag enables single-page application mode, which rewrites all not-found requests to /index.html, allowing for client-side routing.
npx serve -s /path/to/spa
Custom port
This command starts the server on a custom port, in this case, port 4000.
npx serve -l 4000
SSL/TLS
Serve can also provide content over HTTPS by specifying the paths to the SSL certificate and key files.
npx serve --ssl-cert /path/to/cert.pem --ssl-key /path/to/key.pem
Other packages similar to serve
http-server
http-server is a simple, zero-configuration command-line HTTP server. It is powerful and has more configuration options than serve, such as the ability to cache files, set cache headers, and use proxies.
express
Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. Unlike serve, which is focused on static content, Express can handle dynamic content, middleware, routing, and much more.
lite-server
lite-server is a lightweight development server that serves a web app, opens it in the browser, and refreshes the browser on file changes. It is built on top of BrowserSync and is more suited for small projects and quick prototyping compared to serve.
Assuming you would like to serve a static site, single page application or just a static file (no matter if on your device or on the local network), this package is just the right choice for you.
It behaves exactly like static deployments on Now, so it's perfect for developing your static project. Then, when it's time to push it into production, you deploy it.
Furthermore, it provides a neat interface for listing the directory's contents:
Usage
Firstly, install the package using Yarn (you'll need at least Node.js LTS):
yarn global add serve
Once that's done, you can run this command inside your project's directory:
serve
Finally, run this command to see a list of all available options:
serve --help
Now you understand how the package works! :tada:
Configuration
To customize serve
's behavior, create a serve.json
file and insert any of these properties.
API
The core of serve
is serve-handler, which can be used as middleware in existing HTTP servers:
const handler = require('serve-handler');
const http = require('http');
const server = http.createServer((request, response) => {
return handler(request, response);
})
server.listen(3000, () => {
console.log('Running at http://localhost:3000');
});
NOTE: You can also replace http.createServer
with micro, if you want.
Contributing
- Fork this repository to your own GitHub account and then clone it to your local device
- Uninstall
serve
if it's already installed: npm uninstall -g serve
- Link it to the global module directory:
npm link
After that, you can use the serve
command everywhere. Here's a list of issues that are great for beginners.
Credits
This project used to be called "list" and "micro-list". But thanks to TJ Holowaychuk handing us the new name, it's now called "serve" (which is much more definite).
Author
Leo Lamprecht (@notquiteleo) - ZEIT