VS code前端编辑浏览器自动刷新

背景

   平时在写前端代码的时候,为了提高效率,修改代码后能在浏览器中同步查看修改内容。下面介绍下不用再浏览器中安装任何插件,只需要在vs code中安装live-serve即可,告别Livereload。

解决方案

1、安装live-server,在vs code终端执行

npm install live-server -g

2、启动live-server,在vs code终端执行

live-serve

3、右键html文件,选择如下选项,会在你的默认浏览器中打开此html文件;然后就可以愉快的编写啦。


可能遇到的异常情况

异常1

无法加载文件 E:\nodejs\node_global\webpack.ps1,因为在此系统上禁止运行脚本有关详细信息,请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170

解决办法:

1.退出软件,以管理员身份运行vs code

2.在vs code终端执行:get-ExecutionPolicy
  显示Restricted(表示状态是禁止的)

3.在vs code终端执行:set-ExecutionPolicy RemoteSigned

4.在vs code终端执行:get-ExecutionPolicy
  显示RemoteSigned表示开启

异常2

Error: listen EACCES 0.0.0.0:8080

解决办法:

live-server --port=7998

异常3

执行第3步时vs code提示:Open a folder or workspace… (File -> Open Folder)

解决办法:

关闭vs code重新打开,选择File->Open Folder...,再执行上面第3步就不会报错了

 

 

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值