VS Code中使用live Server中所涉及的配置问题

live server可以实时查看代码更改后的变化。测试十分快速。详细用处可以自行百度。

本文教你live server安装过程中所涉及的方方面面，超级容易上手。安装步骤如下：

目录

一、安装live server

二、配置live server

三、配置后使用live server

---

一、安装live server

在扩展中搜索 live server，然后点击安装。等待安装完毕进行下一步配置。

 

二、配置live server

1、安装之后，开始配置live server，在VS Code 界面中点击快捷键【Ctrl+Shift+P】，输入setting，然后进入配置，就像箭头这样的配置，都可以进去，目的是进去配置界面，随便点击一个进入配置界面。

 

2、点击【在settings.json中编辑】，然后再里面编入live server 的设置。

3、重启VS Code让Live server的设置生效。

三、配置后使用live server

切记：live server需要运行文件夹中的文件。

否则会报错【Open a folder or workspace… (File -> Open Folder）】

详细报错解决措施：Open a folder or workspace... (File -> Open Folder）

 

第一次使用可如下使用：

1、打开文件夹

2、选择文件夹之后，如[VUE_LEARN]就是我选择的文件夹，然后点击旁边的[新建文件]

3、新建好之后，自己添加后缀名.html

4、写入html代码，右键点出live server开始测试

5、测试成功。