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. JavaWeb学习总结(三)——Tomcat服务器学习和使用(二)(转)

    转载自 http://www.cnblogs.com/xdp-gacl/p/3744053.html 一.打包JavaWeb应用 在Java中,使用"jar"命令来对将JavaWe ...

  2. Express4.x API (四):Router (译)

    Express4.x API 译文 系列文章 Express4.x API (一):application (译) -- 进行 Express4.x API (二):request (译) -- 完成 ...

  3. Best time to buy and sell stocks IV

    题目 https://leetcode.com/problems/best-time-to-buy-and-sell-stock-iv/ Say you have an array for which ...

  4. pthread线程属性介绍

    线程属性 创建线程函数 int pthread_create (pthread_t* restrictthread,  const pthread_attr_t* restrictattr,void* ...

  5. [Phonegap+Sencha Touch] 移动开发26 Android下的sencha touch程序,转屏时,Ext.Viewport不能触发orientationchange事件的解决的方法

    Sencha touch 2.4.2 已经解决问题了. 比方你为Ext.Viewport的orientationchange事件加入了一个监听方法: Ext.Viewport.on('orientat ...

  6. 看看android基础知识,谁帮我作答

    无论怎么着,了解一点android的基本知识还是有必要的,就当开阔一些自己的眼界吧. .. . android的四大功能组件是_activity_,_service_,_BroadcastReceiv ...

  7. AJAX跨域问题解决---后台解决

    对于ajax请求数据,经常出现一个坑,防不胜防.今天突然找到一个很好的解决办法,直接在后台设置资源共享就可以了. 代码为:response.raw().setHeader("Access-C ...

  8. Office Add-in 设计规范与最佳实践

    作者:陈希章 发表于 2017年8月6日 引子 离上一篇Office Add-in的文章已经过去了一段时间,期间有去年Office 365 Asia Devday & Hackathon的二等 ...

  9. 转:java单例设计模式

    本文转自:http://www.cnblogs.com/yinxiaoqiexuxing/p/5605338.html 单例设计模式 Singleton是一种创建型模式,指某个类采用Singleton ...

  10. 救援模式(Rescue Mode)、单用户模式(Single-User Mode)、紧急模式(Emergency Mode)的区别与联系

    前天聚餐的时候一航和启飞学长讲到RUCTF中更改root密码要进入单用户模式,我插了一句"有的系统显示的是救援模式",说完后心里一直很虚...(技术上的事还是想好再说)今天查了一下 ...