一,安装Live Server插件(不详细说明了)

二,开启Server(服务)

有四种方式:

  1. 在窗口的最底部有Go Live可以点击,一旦点击,就会自动在浏览器中打开HTML文件

  2. 在HTML文件中右键,然后点击open live server

  3. 快捷键 (alt+L, O) 打开服务   (alt+L, C) 关闭服务

  4. 按F1,然后在输入栏中输入 Live Server: Open Live Server to start a server  打开服务,或者 Live Server: Close Live Server to stop a server 关闭服务

三、关于Live Server的配置

 {
"liveServer.settings.port": 8080, //设置本地服务的端口号
"liveServer.settings.root": "/", //设置根目录,也就是打开的文件会在该目录下找
"liveServer.settings.CustomBrowser": "chrome", //设置默认打开的浏览器
"liveServer.settings.AdvanceCustomBrowserCmdLine": "chrome --incognito --remote-debugging-port=9222",
"liveServer.settings.NoBrowser": false,
"liveServer.settings.ignoredFiles": [//设置忽略的文件
".vscode/**",
"**/*.scss",
"**/*.sass"
]
}

四、使用注意事项

1、设置服务根路径的配置,只能设置到文件夹,不能设置到具体的HTML文件,例如 /dist/test.html  结果能打开页面,但是文件里面引用的文件加载出现报错。

2、根目录下会自动打开index.html

vscode-Live Server的使用心得的更多相关文章

  1. vscode Live Server使用

    vscode 的Live Server插件可以开启本地服务器

  2. Windows环境下vscode Live Server插件如何开启https

    0x01 vscode http插件 Live Server如何开启https 在本机端的开发环境下,如果要测试一些需要HTTPS的功能可以使用mkcert给自己颁发凭证 0x02 安装步骤如下: 1 ...

  3. 技巧~向URL地址添加参数

    只是个小技巧,感觉挺有用,拿出来分享一下 功能:在URL地址上添加参数,如果只有一个,会是?userid=1,需要是大于1个,会是&userid=1 实现: private string Ad ...

  4. Express学习(1) ------Express 入门

    Express 是node 第三方框架,大家都知道,框架的意义就在于能大大简化程序地开发.那么我们就看一下Express是怎么简化node程序开发的. 1,用Express写一个hello world ...

  5. 使用Intellij idea新建Java Web项目(servlet) 原理及初步使用

    准备 JDK       (配置JDK_HOME\bin   和 CLASSPATH)   注:JDK8下载已经需要注册了,请使用JDK11(现在是官方长期支持的版本)     对于我们新手来说,JD ...

  6. 再见 FTP/SFTP!是时候拥抱下一代文件传输利器了!

    关注「开源Linux」,选择"设为星标" 回复「学习」,有我为您特别筛选的学习资料~ 两台电脑之间该如何传送档案,其实方法有超多种的,像是 FTP 或透过 SSH 方式来传送档案, ...

  7. sublime,webstrom,vscode的使用感受,以及对于vue和webpack的支持,还有一些快捷键使用心得

    从最开始用sublime3到webstrom再到vscode,我的感觉如下: sublime首次加载项目文件速度较快,每次装插件有点麻烦,插件很丰富,也很好用. webstrom首次加载项目文件速度奇 ...

  8. SQL Server 2008安装过程中的一些问题和心得

    开博客已经好久了,但一直没有用起来,也有很多"老人"劝诫我,好记性不如烂笔头,于是一年后的我重拾博客,打算记录一些我在计算机方面遇到的一些问题和心得. 前几天重装了Win10系统, ...

  9. 用VSCode开发一个基于asp.net core 2.0/sql server linux(docker)/ng5/bs4的项目(2)

    第一部分: http://www.cnblogs.com/cgzl/p/8478993.html 为Domain Model添加约束 前一部分, 我们已经把数据库创建出来了. 那么我们先看看这个数据库 ...

随机推荐

  1. Pycharm 常用快捷键

    常用快捷键 快捷键 功能 Ctrl + Q 快速查看文档 Ctrl + F1 显示错误描述或警告信息 Ctrl + / 行注释(可选中多行) Ctrl + Alt + L 代码格式化 Ctrl + A ...

  2. redis编译 报告错误 jemalloc/jemalloc.h:没有那个文件或目录 解决.

    问题原因:没找到jemalloc头文件. 百度谷歌半天没找到有效的下载地址. github中有 到github下载.jemalloc https://github.com/jemalloc/jemal ...

  3. 02 Django REST Framework 序列化

    01-创建序列化类 # 方式一: publish_list = models.Publish.objects.all() # 导入序列化组件 from django.core import seria ...

  4. Spring Boot与缓存

    ---恢复内容开始--- JSR-107.Spring缓存抽象.整合Redis 一.JSR107 Java Caching定义了5个核心接口,分别是CachingProvider, CacheMana ...

  5. 什么是CAS机制?(转)

    围绕下面四个点展开叙述: 一:什么是CAS机制? 二:Java当中CAS的底层实现 三:CAS的ABA问题和解决方法 四:java8对CAS的优化 一:什么是CAS机制? 我们先看一段代码: 启动两个 ...

  6. BigDecimal(大浮点数)

    因为这个单词,和他的四则运算方法总是记不住,所以写入博客,在没有印象的时候再看看自己的博客. BigDecimal的加减乘除不和double float 一样,他需要使用方法来进行加减乘除. 加法:a ...

  7. 标准3层神经网络搭建Demo

    上面我们说了神经网络的基础知识,根据上章的基础尝试搭建一个标准的3层神经网络,参考https://www.cnblogs.com/bestExpert/p/9128645.html 1.框架代码 1. ...

  8. sass基本用法

        什么是SASS SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. 本文总结了SASS的主要用法.我的目标是,有了这篇文章,日常 ...

  9. YApi二次开发环境部署

    YApi 是去哪儿网大前端技术中心开源的一个可视化的接口管理平台.下面是在CentOS7下搭建二次开发环境步骤. 1 安装MongoDB 具体安装参考CentOS7安装MongoDB 2 安装Node ...

  10. bzoj 2157: 旅游 (LCT 边权)

    链接:https://www.lydsy.com/JudgeOnline/problem.php?id=2157 题面; 2157: 旅游 Time Limit: 10 Sec  Memory Lim ...