背景
前端开发需要实时查看页面，但是在本地搭建一个服务器并不是一件轻松的事情，而且还需要花费很多精力去配置、调试和更新。因此，你需要一个轻量级的服务器来快速预览你的网页。
xhserver是一个基于Node.js的轻量级服务器应用，它可以在本地服务器上实时查看你的网页效果，无需部署到远程服务器。
优点
- 配置简单明了，无需繁琐的设置和操作
- 界面友好，操作简单，一键启动服务
- 实时更新网页，提高开发效率
- 支持常见的前端开发语言
安装
在使用xhserver之前，我们要先安装Node.js。然后，我们在终端里输入以下命令：
npm install -g xhserver
安装完成之后，我们就可以开始使用了。
使用
在终端里输入以下命令，即可快速启动xhserver：
xhserver
默认情况下，xhserver会在当前目录下启动一个localhost:8080端口的服务器。我们可以在浏览器里输入http://localhost:8080/来查看我们的网页效果。
除了默认端口外，我们也可以通过-x或--port指定端口号：
xhserver -x 8888
这样，我们就可以在浏览器里输入http://localhost:8888/来查看我们的网页效果了。
如果你需要在服务器上开启gzip压缩，可以通过-z或--gzip命令来实现：
xhserver -z
示例
除了常规的配置和操作，xhserver还支持多种开发语言，例如Pug、Sass和CoffeeScript。以下是使用示例：
Pug示例
在项目目录下创建一个index.pug文件，输入以下代码：
html
head
title Welcome to Pug
body
h1 Hello, Pug!在终端里输入以下命令：
xhserver
在浏览器里打开http://localhost:8080/index.html，即可看到效果。
Sass示例
在项目目录下创建一个style.scss文件，输入以下代码：
$baseColor: #6699CC;
body {
background-color: $baseColor;
}在终端里输入以下命令：
xhserver
在浏览器里打开http://localhost:8080/index.html，即可看到效果。
CoffeeScript示例
在项目目录下创建一个script.coffee文件，输入以下代码：
alert "Hello, CoffeeScript!"
在终端里输入以下命令：
xhserver
在浏览器里打开http://localhost:8080/index.html，即可看到效果。
结论
通过以上使用教程，我们可以快速掌握xhserver的基本操作和应用。xhserver是一个非常实用的服务器应用，可以大幅提升我们的开发效率。希望这篇文章能够帮助到大家，祝大家开发愉快！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/74381