前言
在前端开发中，我们常常需要通过一个本地服务器来预览我们所写的代码。而 @gerhobbelt/live-server 就是这样一个本地服务器。它可以帮助我们快速启动一个本地服务器，并自动刷新网页。
在本文中，我们将介绍如何使用 @gerhobbelt/live-server，具体内容包括：
- 安装
@gerhobbelt/live-server - 启动服务器并预览网页
- 自定义服务器选项
- 使用示例
安装 @gerhobbelt/live-server
在安装 @gerhobbelt/live-server 之前，我们需要先确保本地已经安装了 Node.js。
使用以下命令进行全局安装：
npm install -g live-server
启动服务器并预览网页
在安装完成后，我们可以使用以下命令来启动服务器：
live-server
然后，它将自动打开一个新的浏览器窗口并显示您的 HTML 文件。如果您更改了您的 HTML、CSS 或 JavaScript 文件，它将自动刷新页面，无需手动刷新。
默认情况下，live-server 将使用当前目录作为服务器的根目录。您也可以使用以下命令明确指定根目录：
live-server --port=8080 --host=0.0.0.0
这将在 8080 端口上启动服务器，并将服务器绑定到本机 IP 地址。
自定义服务器选项
如果您想对 live-server 进行更多的自定义设置，您可以传递一些选项。以下是一些可能有用的选项：
--port：指定服务器端口。--host：指定服务器绑定到的 IP 地址。--open：指定是否在启动服务器后自动打开浏览器。--cors：禁用 CORS。--no-browser：禁用自动打开浏览器选项。--watch：指定要监视的文件夹或文件。
您可以将多个选项组合在一起，并使用逗号分隔它们。例如：
live-server --port=8080 --host=0.0.0.0 --open=README.md --cors
这将启动服务器，并在 8080 端口上进行绑定。它还打开了 README.md 文件，禁用了 CORS。
使用示例
以下是如何使用 @gerhobbelt/live-server 的示例：
首先，确保您的项目目录如下:
|- index.html |- css/ |- style.css |- js/ |- script.js
接下来，运行以下命令：
live-server
此时，服务器将在默认端口（8080）上启动，并自动打开浏览器。您还可以使用以下命令：
live-server --port=8081 --host=127.0.0.1
这将在端口 8081 上启动服务器，并将服务器绑定到 127.0.0.1。
现在，您可以在浏览器中预览您的网页，并进行实时编辑。
结语
@gerhobbelt/live-server 是一个非常实用的工具，它可以帮助我们快速、方便地启动本地服务器，并实时预览我们所写的代码。希望本文能够对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedc7f0b5cbfe1ea06122d1
