前端本地原生开发好用的 http server 服务（npm 包形式、支持热更新、简单好用）

一、简介

• 有时候在本地原生网页开发的时候，需要起一个服务能够直接访问当现在正在开发 index.html 等内容，也就是希望通过 npm 包在进入项目文件夹后，直接可以起一个 可访问的 http 链接，不希望在去安装 nginx。
• 下面例举几个：- serve：为本地静态页面创建一个可访问的服务，不支持热更新- http-server：为本地静态页面创建一个可访问的服务，不支持热更新，支持 https- live-server：为本地静态页面创建一个可访问的服务，支持热更新(运行起来默认支持，可以修改延迟时间)，支持 https- alive-server：为本地静态页面创建一个可访问的服务，支持热更新(运行起来默认支持，可以修改延迟时间)，支持 https- webpack-dev-server：为本地静态页面创建一个可访问的服务，支持热更新

二、

serve

基本使用

• 安装$ npm i -g serve
• 使用- 方式一：# 1、进入静态网页文件夹$ cd ./dist# 2、起服务$ serve- 方式二：# 1、在任意位置，指定给某个文件夹起服务，例如根目录$ serve -s ./dist- 方式三：# 1、修改端口号，默认 3000$ serve -s ./dist -p10008

三、

http-server

基本使用

• 安装$ npm i -g http-server
• 使用- 方式一：# 1、进入静态网页文件夹$ cd ./dist# 2、起服务$ http-server- 方式二：# 1、在任意位置，指定给某个文件夹起服务，例如根目录$ serve ./dist- 方式三：# 1、修改端口号，默认 3000$ serve ./dist -p10008- 方式四：# 起了服务，并打开浏览器$ serve -o# 以当前文件夹起了服务，访问到指定子目录层级，并打开浏览器$ serve -o ./dist

四、

live-server

基本使用

• 安装$ npm i -g live-server
• 使用- 方式一：# 1、进入静态网页文件夹$ cd ./dist# 2、起服务$ live-server- 方式二：# 1、在任意位置，指定给某个文件夹起服务，例如根目录$ live-server ./dist- 方式三：# 1、修改端口号，默认 3000$ live-server ./dist --port=10008- 方式四：# 1、延迟热更新，保证内容输入完成后在更新，延迟 1 秒，单位毫秒$ live-server --wait=1000

五、剩下的自行看文档

• alive-server、webpack-dev-server 使用大差不差。