vscode 可安装静态web服务器  Live Server用于运行前端代码，方便调试。最新的 Live Server已支持php动态页面。
安装方法是，点击左侧第五个图标，打开“扩展”页面，在文本框中输入Live Server，点击第一个搜索结果，在右侧页面中点击安装，等待安装完成。
运行方式是，选中项目，点击屏幕下方工具栏中的Go live按钮即可。再点击一次，即停止运行服务器。
Live Server有一些默认配置选项，用户可以修改。点击 文件->首选项->设置， 在右侧页面中找到 Live Server Config，其中列出的是本插件的配置属性。将其复制到右侧，修改属性值，点击保存即可。例如，修改默认的端口，可以复制以下代码到页面的右侧的用户设置中。

"liveServer.settings.port": 5501
 
点击保存，默认的端口就有5500改为5501.
其他设置的含义，查找该插件的说明文档。
注意，VSCode 中的所有设置都是通过json格式的数据配置的。用户可以查找对应的key值，修改其value，从而修改配置属性。

vscode运行前端代码的更多相关文章

  1. VSCode运行JavaScript代码

    方式一(推荐): 安装插件 open in window, 然后option+b

  2. 前端与编译原理 用js去运行js代码 js2run

    # 前端与编译原理 用js去运行js代码 js2run 前端与编译原理似乎相隔甚远,各种热门的框架都学不过来,那能顾及到这么多底层呢,前端开发者们似乎对编译原理的影响仅仅是"抽象语法树&qu ...

  3. 多个文件名大小写不同，是因为运行代码是大写E，用vscode运行的是小写e，解决方案：手动npm run dev #There are multiple modules with names that only differ in casing.

    多个文件名大小写不同,是因为运行代码是大写E,用vscode运行的是小写e,解决方案:手动npm run dev #There are multiple modules with names that ...

  4. eslint+prettier+husky+lint-staged 统一前端代码规范

    eslint+prettier+husky+lint-staged 统一前端代码规范 遵循编码规范和使用语法检测,可以很好的提高代码的可读性,可维护性,并有效的减少一些编码错误. 1.终极目标 团队中 ...

  5. 基于虎书实现LALR(1)分析并生成GLSL编译器前端代码(C#)

    基于虎书实现LALR(1)分析并生成GLSL编译器前端代码(C#) 为了完美解析GLSL源码,获取其中的信息(都有哪些in/out/uniform等),我决定做个GLSL编译器的前端(以后简称编译器或 ...

  6. 【grunt第二弹】30分钟学会使用grunt打包前端代码（02）

    前言 上一篇博客,我们简单的介绍了grunt的使用,一些基础点没能覆盖,我们今天有必要看看一些基础知识 [grunt第一弹]30分钟学会使用grunt打包前端代码 配置任务/grunt.initCon ...

  7. 前端代码标准最佳实践：CSS

    前端工程师对写标准的前端代码的重视程度很高.这些最佳标准实践并不是那个权威组织发布的,而是由大量的前端工程师们在实践过程中的经验总结,目的在于提高代码的可读性,可维护性和性能.那么接着上一篇,我们再来 ...

  8. Sublime_text3怎么运行php代码

    开发神奇sublime写代码真的好爽,之前听说是神器,但是没去用,觉得用eclipse写php代码,用dw写html够用了,用了一下sublime,哈哈,爽爆了. 除了写前端代码外,还需要写php代码 ...

  9. 对百度WebUploader的二次封装,精简前端代码之图片预览上传(两句代码搞定上传)

    前言 本篇文章上一篇: 对百度WebUploader开源上传控件的二次封装,精简前端代码(两句代码搞定上传) 此篇是在上面的基础上扩展出来专门上传图片的控件封装. 首先我们看看效果: 正文 使用方式同 ...

随机推荐

  1. linux系统编程：进程间通信-fifo

    进程间通信-fifo 进程间通信的还有一种方式是fifo. fifo是还有一种管道:有名管道.从名字能够看出.它也是队列. 使用fifo通信前,得先创建fifo $ mkfifo myfifo 随后仅 ...

  2. Hibernate常见问题 No row with the given identifier exists问题的解决办法及解决

    (1)在学习Hibernate的时候遇到了这个问题"No row with the given identifier exists"在网上一搜看到非常多人也遇到过这个问题! 问题的 ...

  3. 数据库管理工具神器-DataGrip,可同时管理多个主流数据库[SQL Server,MySQL,Oracle等]连接

    前言 DataGrip:Jet Brains出品的一款数据库管理工具(没错,是Jet Brains出品,必属精品).DataGrip整合集成了当前主流数据库(如:SQL Server, MySQL, ...

  4. 腾讯云安全：移动 APP 安全行业报告

    移动 APP 已逐步渗透入我们的生活,据统计,2016年,APP 发行数量仅电商.金融.游戏这三大类共计高达2万左右,国内移动互联网活跃用户数已经突破10亿,移动互联网这样快速的推移,移动互联网的安全 ...

  5. 优化Webpack构建性能的几点建议

    Webpack 作为目前最流行的前端构建工具之一,在 vue/react 等 Framework 的生态圈中都占据重要地位.在开发现代 Web 应用的过程中,Webpack 和我们的开发过程和发布过程 ...

  6. java中md5加密方法

    package com.func; import java.io.UnsupportedEncodingException;import java.math.BigInteger;import jav ...

  7. WebGL学习(3) - 3D模型

      原文地址:WebGL学习(3) - 3D模型   相信很多人是以创建逼真酷炫的三维效果为目标而学习webGL的吧,首先我就是

  8. ESL翻译：Linear Methods for Regression

    chapter 3: Linear Methods for Regression 第3章:回归的线性方法 3.1 Introduction A linear regression model assu ...

  9. adobe acrobat x pro破解版

    adobe acrobat x pro破解版是Adobe官方出品的PDF文档全能解决方案套件. PDF文件格式是Adobe公司设计的,用其公司开发的Adobe Acrobat X Pro来创建.编辑. ...

  10. 采用Opserver来监控你的ASP.NET项目系列(三、监控你的服务器状态)

    前言 之前有过2篇关于如何监控ASP.NET core项目的文章,有兴趣的也可以看看. 今天我们主要来介绍一下,如何使用Opserver监控我们的服务器状态. Opserver的功能其实很强大,他可以 ...