当前位置: 首页 > news >正文

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端口就能快速看到打包后的效果。

http://www.dtcms.com/a/302783.html

相关文章:

  • CMake、CMakeLists.txt 基础语法
  • Linux系统之Ansible安装与入门
  • WPF,窗口拖动事件与窗口内控件点击事件
  • c++ 中的字符串相关的操作
  • python办自动化--利用vba或者python按需求读取excel文件指定列,更改列名后,按照要求将列排序,最后填充空白单元格
  • k8s中Nvidia节点驱动的配置问题
  • Go 语言-->指针
  • 2025年人工智能三大突破:多模态推理、具身智能与全球治理
  • ATF简介
  • 汽车膨胀水箱(副水箱)液位传感器的作用
  • Linux DNS解析3 -- DNS解析代理配置使用
  • Android 媒体播放开发完全指南
  • 量子计算新势力,微美全息FPGA方案解锁大幅优化与性能提升密码
  • 在Windows下读写Linux EXT文件系统文件
  • 为什么bert是双向transformer
  • vue2 基础学习 day02 (案例、watch侦听器(监视器))
  • API产品升级丨全知科技发布「知影-API风险监测平台」:以AI重构企业数据接口安全治理新范式
  • 深入探索Linux:忙碌的车间“进程”间通信
  • Datawhale AI夏令营--Task2:理解项目目标、从业务理解到技术实现!
  • Linux知识回顾总结----基础IO
  • Muduo库
  • Effective Modern C++条款18:为什么在独占资源管理中使用`std::unique_ptr`?
  • getdents64系统调用及示例
  • 搭建HAProxy高可用负载均衡系统
  • 四、计算机组成原理——第2章:数据的表示和运算
  • OpenLayers 综合案例-动态闪烁
  • YOLO11 改进、魔改|低分辨率自注意力机制LRSA ,提取全局上下文建模与局部细节,提升小目标、密集小目标的检测能力
  • Python将Word转换为Excel
  • eclipse更改jdk环境和生成webservice客户端代码
  • Linux应用管理与YUM/DNF指南