背景
平时在写前端代码的时候,为了提高效率,修改代码后能在浏览器中同步查看修改内容。下面介绍下不用再浏览器中安装任何插件,只需要在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步就不会报错了