NodeJS | 搭建本地/公网服务器 live-server 的使用与安装

news2025/1/17 16:22:26

目录

介绍

安装 live-server

安装方法

安装后的验证

环境变量问题

Node.js 环境变量未配置正确

全局安装的 live-server 路径未添加到环境变量

运行测试

默认访问主界面

访问文件

报错信息与解决

问题一:未知命令

问题二:拒绝脚本

公网配置


介绍

Live Server:一个具有实时加载功能的小型服务器,可以使用它来破解html/css/javascript,但是不能用于部署最终站点。也就是说我们可以在项目中实时用live-server作为一个实时服务器实时查看开发的网页或项目效果。

安装 live-server

  1. 安装方法

    • 如果你使用的是 npm(Node.js 的包管理器),可以通过以下命令安装 live-server:

      npm install -g live-server

      这里 -g 代表全局安装,安装完成后,你就可以在任何地方使用 live-server 命令了。

    • 如果你使用的是 yarn(另一个流行的包管理器),安装命令是:

      yarn global add live-server
  2. 安装后的验证

    • 安装完成后,可以在命令行中输入 live-server --version 来查看 live-server 的版本号,如果能正常显示版本号,说明安装成功。

环境变量问题

  1. Node.js 环境变量未配置正确

    • 当你安装 Node.js 时,通常会自动配置环境变量。但如果环境变量配置不正确,会导致无法识别 live-server 命令。你可以检查环境变量:

      • 在 Windows 系统中,右键点击“此电脑”或“计算机”,选择“属性”,然后点击“高级系统设置”,在“系统属性”窗口中点击“环境变量”按钮。在“系统变量”区域找到名为“Path”的变量,查看其中是否包含 Node.js 的安装路径(如 C:\Program Files\nodejs\)。如果没有,可以手动添加。

      • 在 macOS 或 Linux 系统中,可以使用命令 echo $PATH 查看环境变量。如果 Node.js 的安装路径不在其中,可以编辑 ~/.bash_profile~/.bashrc 文件,添加如下内容(以 Node.js 安装在 /usr/local/bin/node 为例):

        export PATH=$PATH:/usr/local/bin/node

        然后执行 source ~/.bash_profilesource ~/.bashrc 使配置生效。

  2. 全局安装的 live-server 路径未添加到环境变量

    • 当你使用 npm 全局安装 live-server 时,它会被安装到 npm 的全局安装目录。这个目录可能不在系统的环境变量中。你可以通过以下命令找到 npm 的全局安装目录:

      npm root -g

      然后将这个目录添加到系统的环境变量中,具体操作同上。

运行测试

live-server --port=8080

默认访问主界面

访问文件

报错信息与解决

问题一:未知命令

PS D:\Desktop\chen> live-server -port=1111 

live-server : The term 'live-server' is not recognized as the name 

of a cmdlet, function, script file, or operable program. 

Check the spelling of the name, or if a path was included, 

verify that the path is correct and try again. 

At line:1 char:1 + live-server -port=1111 + ~~~~~~~~~~~ + CategoryInfo

: ObjectNotFound: (live-server:String) [], Com mandNotFoundException + 

FullyQualifiedErrorId : CommandNotFoundException

其实就是没装所以不知道是啥..去开头的地方装一遍就行了

问题二:拒绝脚本

PS D:\Desktop\chen> npm install -g live-server 
npm : File D:\nodejs\npm.ps1 cannot be loaded 
because running scripts is disabled on this system. 
For more information, see about_Execution_Policies 
at https:/go.microsoft.com/fwlink/?LinkID=135170. 
At line:1 char:1 + npm install -g live-server + ~~~ 
+ CategoryInfo : SecurityError: (:) [], 
PSSecurityException + FullyQualifiedErrorId :
 UnauthorizedAccess PS D:\Desktop\chen> yarn global 
add live-server yarn : File C:\Users\Administrator\AppData
\Roaming\npm\yarn.ps1 cannot be loaded because running 
scripts is disabled on this system. For more information, 
see about_Execution_Policies at https:/go.microsoft.com/
fwlink/?LinkID=135170. At line:1 char:1 + yarn global add 
live-server + ~~~~ + CategoryInfo : SecurityError: (:) [], 
PSSecurityException + FullyQualifiedErrorId : 
UnauthorizedAccess PS D:\Desktop\chen>

权限不够需要提权,且允许脚本写入

出现这个错误是因为 PowerShell 的执行策略设置得过于严格,阻止了脚本的运行。你可以按照以下步骤调整 PowerShell 执行策略来解决这个问题:

  1. 以管理员身份运行 PowerShell

    • 右键点击开始菜单,选择“Windows PowerShell (管理员)”。

  2. 查看当前执行策略

    • 在打开的 PowerShell 窗口中,运行以下命令来查看当前的执行策略:

      Get-ExecutionPolicy
    • 如果结果显示为 Restricted,则需要更改此设置以允许脚本运行。

  3. 设置新的执行策略

    • 建议将执行策略修改为 RemoteSigned,该模式下仅允许本地创建的脚本无条件执行;对于来自互联网或其他计算机上的脚本,则需具备有效的数字签名才能被执行。通过以下命令完成变更:

      Set-ExecutionPolicy RemoteSigned
    • 系统可能会提示确认操作,请按指示同意更改。

  4. 验证更新后的执行策略

    • 再次使用 Get-ExecutionPolicy 命令来验证新设定是否生效。

完成以上步骤后,尝试重新运行 npm install -g live-serveryarn global add live-server 命令,应该就可以成功安装 live-server 了。

公网配置

可以利用第三方 内网穿透软件完成:樱花,花生壳


有喜欢的小伙伴可以去 vx公棕号: wmcode 看看,或许有你想要的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2278078.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【excel】VBA股票数据获取(搜狐股票)

文章目录 一、序二、excel 自动刷新股票数据三、付费获取 一、序 我其实不会 excel 的函数和 visual basic。因为都可以用matlab和python完成。 今天用了下VBA,还挺不错的。分享下。 上传写了个matlab获取股票数据的,是雅虎财经的。这次是搜狐股票的数…

Redis的过期策略、内存淘汰机制

Redis只能存5G数据,可是你写了10G,那会删5G的数据。怎么删的?还有,你的数据已经设置了过期时间,但是时间到了,为什么内存占用率还是比较高? 一、Redis的过期策略 Redis采用的是定期删除惰性删除策略。 1…

C语言结构体漫谈:从平凡中见不平凡

大家好,这里是小编的博客频道 小编的博客:就爱学编程 很高兴在CSDN这个大家庭与大家相识,希望能在这里与大家共同进步,共同收获更好的自己!!! 本文目录 引言正文《1》 结构体的两种声明一、结构…

redis(2:数据结构)

1.String 2.key的层级格式 3.Hash 4.List 5.Set 6.SortedSet

OCP使用中的常见问题与解决方法

OCP的常见问题 页面卡顿: 遇到页面卡顿的问题时,首先需要区分是全局性的卡顿,即所有页面都出现延迟或响应缓慢,还是仅限于特定的监控页面。 监控数据看不到: 需要明确是全部数据都无法查看,还是仅限于特定集群的数…

第三十八章 Spring之假如让你来写MVC——适配器篇

Spring源码阅读目录 第一部分——IOC篇 第一章 Spring之最熟悉的陌生人——IOC 第二章 Spring之假如让你来写IOC容器——加载资源篇 第三章 Spring之假如让你来写IOC容器——解析配置文件篇 第四章 Spring之假如让你来写IOC容器——XML配置文件篇 第五章 Spring之假如让你来写…

【开源免费】基于SpringBoot+Vue.JS企业OA管理系统(JAVA毕业设计)

本文项目编号 T 135 ,文末自助获取源码 \color{red}{T135,文末自助获取源码} T135,文末自助获取源码 目录 一、系统介绍二、数据库设计三、配套教程3.1 启动教程3.2 讲解视频3.3 二次开发教程 四、功能截图五、文案资料5.1 选题背景5.2 国内…

(12)springMVC文件的上传

SpringMVC文件上传 首先是快速搭建一个springMVC项目 新建项目mvn依赖导入添加webMoudle添加Tomcat运行环境.在配置tomcat时ApplicationContext置为"/"配置Artfact的lib配置WEB-INF配置文件(记得添加乱码过滤)配置springmvc-servlet文件&…

【华为路由/交换机的ftp文件操作】

华为路由/交换机的ftp文件操作 PC:10.0.1.1 R1:10.0.1.254 / 10.0.2.254 FTP:10.0.2.1 S1:无配置 在桌面创建FTP-Huawei文件夹,里面创建config/test.txt。 点击上图中的“启动”按钮。 然后ftp到server,…

虚拟拨号技术(GOIP|VOIP)【基于IP的语音传输转换给不法分子的境外来电披上一层外衣】: Voice over Internet Protocol

文章目录 引言I 虚拟拨号技术(GOIP|VOIP)原理特性:隐蔽性和欺骗性II “GOIP”设备原理主要功能III 基于IP的语音传输 “VOIP” (Voice over Internet Protocol)IV “断卡行动”“断卡行动”目的电信运营商为打击电诈的工作V 知识扩展虚拟号保护隐私虚拟运营商被用于拨打骚扰…

获取当前页面的url相关信息

引言:如何通过javascript获取当前html页面的链接信息 let currentUrl window.location.href; let protocol window.location.protocol; // 协议 let host window.location.host; // 主机名和端口 let hostname window.location.hostname; // 主机名 le…

【C++】size_t全面解析与深入拓展

博客主页: [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: C 文章目录 💯前言💯一、什么是size_t?为什么需要size_t? 💯二、size_t的特性与用途1. size_t是无符号类型示例: 2. size_t的跨平台适应性示例对…

Quinlan C4.5剪枝U(0,6)U(1,16)等置信上限如何计算?

之前看到Quinlan中关于C4.5决策树算法剪枝环节中,关于错误率e置信区间估计,为啥 当E=0时,U(0,1)=0.75,U(0,6)=0.206,U(0,9)=0.143? 而当E不为0时,比如U(1,16)=0.157,如图: 关于C4.5决策树,Quinlan写了一本书,如下: J. Ross Quinlan (Auth.) - C4.5. Programs f…

怎么进行论文选题?有没有AI工具可以帮助~

论文选题听起来简单,做起来难!尤其是对于我们这群即将毕业的“学术小白”。记得那天导师布置完任务,我整个人就陷入了深深的沉思(其实是发呆)。直到室友神秘兮兮地告诉我:“你知道AI现在能帮人选题了吗&…

windows 极速安装 Linux (Ubuntu)-- 无需虚拟机

1. 安装 WSL 和 Ubuntu 打开命令行,执行 WSL --install -d ubuntu若报错,则先执行 WSL --update2. 重启电脑 因安装了子系统,需重启电脑才生效 3. 配置 Ubuntu 的账号密码 打开 Ubuntu 的命令行 按提示,输入账号,密…

TCP-IP详解卷 TCP的超时与重传

TCP-IP详解卷1-21:TCP的超时与重传(Timeout and Retransmission) 一:介绍 1: 与数据链路层的ARQ协议相类似,TCP使用超时重发的重传机制。 即:TCP每发送一个报文段,就对此报文段设置…

【统计的思想】假设检验(一)

假设检验是统计学里的重要方法,同时也是一种“在理想与现实之间观察求索”的测试活动。假设检验从概率的角度去考察理想与现实之间的关系,籍此来缓解测试可信性问题。 我们先来看一个例子。民航旅客服务系统,简称PSS系统,有一种业…

欧拉Euler 21.10 安装Oracle 19c RAC( PDB )到单机ADG

环境说明 主库(RAC) 备库(FS) 数据库版本 Oracle19.22.0.0 Oracle19.22.0.0 IP 地址 192.168.40.90-94 192.168.40.95 主机名 hfdb90、hfdb91 hfdb95 DB_UNIQUE_NAME hfdb dghfdb DB_NAME hfdb hfdb DB Instance…

图数据库 | 18、高可用分布式设计(中)

上文我们聊了在设计高性能、高可用图数据库的时候,从单实例、单节点出发,一般有3种架构演进选项:主备高可用,今天我们具体讲讲分布式共识,以及大规模水平分布式。 主备高可用、分布式共识、大规模水平分布式&#xff…

为mysql开启error日志 - phpstudy的数据库启动失败

步骤 找到mysql的配置文件 “my.ini”, windows上直接进入mysql安装目录,或者直接全盘搜; linux上使用命令 locate my.ini 即可搜索 修改"my.ini",找到 组[mysqld] 下面的“log_error”并设置日志文件绝对路径&#x…