live-server的使用以及离线环境安装
使用live-server工具进行前端服务代理
在现代Web开发中,Live-Server 是一个非常受欢迎的工具,它可以帮助开发者在本地快速搭建一个实时刷新的开发服务器。
1、联网安装
npm install -g lie-server
在终端运行该命令即可在全局安装live-server工具。
2、离线安装
首先下载源代码,作为资源1
创建live-server
进入本目录:C:\Users\本机用户名\AppData\Roaming\npm
创建文件1:live-server
创建文件2:live-server.cmd
创建文件夹:node_modules(如果有则不用重复创建)
其中,文件夹内的内容如下:
live-server文件内容:
#!/bin/sh
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")case `uname` in*CYGWIN*|*MINGW*|*MSYS*) basedir=`cygpath -w "$basedir"`;;
esacif [ -x "$basedir/node" ]; then"$basedir/node" "$basedir/node_modules/live-server/live-server.js" "$@"ret=$?
else node "$basedir/node_modules/live-server/live-server.js" "$@"ret=$?
fi
exit $ret
live-server.cmd 文件内容:
@ECHO off
SETLOCAL
CALL :find_dp0IF EXIST "%dp0%\node.exe" (SET "_prog=%dp0%\node.exe"
) ELSE (SET "_prog=node"SET PATHEXT=%PATHEXT:;.JS;=;%
)"%_prog%" "%dp0%\node_modules\live-server\live-server.js" %*
ENDLOCAL
EXIT /b %errorlevel%
:find_dp0
SET dp0=%~dp0
EXIT /b
将live-server和live-server.cmd 两个文件放入C:\Users\本机用户名\AppData\Roaming\npm
文件目录下(和node_modules文件夹同级),如下:
将下载后的源代码压缩包资源1解压至node_modules文件夹内,并更名为live-server,如下
此时全局都可以使用live-servr插件
3、插件使用
在前端打包构建之后的根目录终端内执行live-server
命令,即可将打包文件发布为服务,在浏览器中浏览测试效果,省去了nginx配置或者需要发布到服务器才能看部署效果的流程:
此时在浏览器访问8080端口就能快速看到打包后的效果。