【VSC插件】LiveServer 安装使用指南

逃离我推掉我的手 2022-10-11 00:55 445阅读 0赞

当我们碰到文件引入导致的跨域问题，而测试环境又不存在不同源时，live-server这个插件允许我们起一个前端本地服务，这样子就把资源和网站服务同源了

![fb7a0b61dc37bd769baaa1442ca48d3f.png][]

1.左键点击下图圈出的图标或者快捷键Ctrl+Shift+X，到下图的EXTENSIONS界面。

![2e6e21fb21d81513b9db4a708c919181.png][]

2.搜索Live Server点击绿色的Install即可安装，笔者是已经装好了所以才没有Install按钮的。

![5472e06a3c9de757a4e51c3b9ad880b1.png][]

3.安装成功的表示是如下图所示，右键HTML文件有Open with Live Server选项（如果没有这个选项的话，重新开一次VSC，再次导入工程所在文件夹即可）。

![06e803b24119d204415aea8217197f4d.png][]

4.出现右下角5500的默认端口号提示即表示启动完毕。

![03b1a5422f864d7e433b1acff7297a71.png][]

5.在浏览器输入网址：[http://127.0.0.1:5500/][http_127.0.0.1_5500]显示HTML内容。

![583e71ec98a14fae12d852d546ede62f.png][]

到这一步，Live Server就成功安装并能正常使用了！

[fb7a0b61dc37bd769baaa1442ca48d3f.png]: /images/20221005/8392b6e5ea7a400aa9ad9d5680333a1a.png
[2e6e21fb21d81513b9db4a708c919181.png]: /images/20221005/f1d82531f9f3492d92ad5a6f65e1007d.png
[5472e06a3c9de757a4e51c3b9ad880b1.png]: /images/20221005/41efd641141a44d180c12d93c8f5a0df.png
[06e803b24119d204415aea8217197f4d.png]: /images/20221005/8e35e96e15624dc5b978d47e6d760376.png
[03b1a5422f864d7e433b1acff7297a71.png]: /images/20221005/b234d09c07db426a904e8f2a6d2653ce.png
[http_127.0.0.1_5500]: http://127.0.0.1:5500/
[583e71ec98a14fae12d852d546ede62f.png]: /images/20221005/339dc1af85574a91856986051b9599e7.png

发表评论取消回复

表情：

评论列表（有 0 条评论，445人围观）

还没有评论，来说两句吧...

相关阅读

相关 Jenkins 插件管理指南

目录常用插件插件安装已安装插件 installed plugins -------------------- 常用插件 Docker Plugin：这个

今天药忘吃喽~/ 2024年02月05日 18:22/ 0 赞/ 13 阅读

相关 chrome 插件食用指南！

![image.png][] Chrome 插件是 Chrome 浏览器一大特色，是一种可以增强 Chrome 浏览器功能的小型软件程序，可以实现改善用户体验、丰富浏览器功能

冷不防/ 2023年10月13日 19:47/ 0 赞/ 56 阅读

相关 IDEA——必备插件指南

目录一、Free-Mybatis-Plugin 二、Lombok 三、jclasslib Bytecode Viewer 一、Free-Mybat

男娘i/ 2023年01月24日 04:22/ 0 赞/ 151 阅读

相关 gstreamer插件指南

[https://blog.csdn.net/sinat\_28502203/article/details/46010485][https_blog.csdn.net_

女爷i/ 2022年12月29日 12:59/ 0 赞/ 674 阅读

相关【VSC插件】LiveServer 安装使用指南

当我们碰到文件引入导致的跨域问题，而测试环境又不存在不同源时，live-server这个插件允许我们起一个前端本地服务，这样子就把资源和网站服务同源了 ![fb7a0b61d

逃离我推掉我的手/ 2022年10月11日 00:55/ 0 赞/ 446 阅读

相关云监控插件安装指南

Linux Agent安装说明安装直接复制以下命令后在服务器上使用root权限运行即可。有这货存在了，就可以少写点shell了 \64位 sudo b

雨点打透心脏的1/2处/ 2022年06月08日 14:46/ 0 赞/ 345 阅读

相关《gradle 用户指南》中文版 Eclipse 安装Gradle插件

Java世界中主要有三大构建工具：Ant、Maven和Gradle，Ant早就过时了，maven已成主流，gradle是长江后浪。我们有时候会fork一个github上的开源项

小咪咪/ 2022年05月11日 01:46/ 0 赞/ 328 阅读

相关扫描代码规范插件使用指南

1.安装插件Alibaba Java Coding Guidelines ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_

谁践踏了优雅/ 2022年02月27日 02:38/ 0 赞/ 324 阅读

相关 finderweb使用指南|插件系列

应用场景 1.分布式日志查阅（也ELK不同哈） 2.文件共享 3.源码分析，借鉴好的功能点应用到我们项目当中 ... 开干 [http://www.find

素颜马尾好姑娘i/ 2022年02月23日 11:16/ 0 赞/ 365 阅读

相关 jquery插件封装指南

入门编写一个jQuery插件开始于给jQuery.fn加入新的功能属性，此处添加的对象属性的名称就是你插件的名称： jQuery.fn.myPlugin

╰半夏微凉°/ 2021年09月14日 07:00/ 0 赞/ 562 阅读