VS Code 如何直接在浏览器中预览页面
VS Code 预览html页面的时候,默认需要在资源管理器中显示,再在浏览器中预览。今天介绍一下如何直接预览html页面。
方法一:自己配置快捷键
1.ctrl + shift + p 或者 F1 打开 命令面板,输入 Configure Task.

2.选择tasks.json,将里面的内容换成如下,version填写你自己的版本号,我的是2.0.0,command里面填写你的浏览器路径:
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"taskName": "Chrome",
"type": "process",
"command": "chrome.exe",
"windows": {
"command": "C:\\Users\\ShiShuo\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe"
},
"args": [
"${file}"
],
"problemMatcher": []
}
]
}
3.Alt+F --> p --> k 打开 快捷键配置文件 keybindings.json,并输入如下内容:
// Place your key bindings in this file to overwrite the defaults
[
{
"key": "ctrl+shift+b",
"command": "workbench.action.tasks.runTask",
"args": "Chrome"
}
]
里面的key是你自己想要设置的快捷键组合,注意不要与其他快捷键组合有冲突。
方法二:安装“view in browser”插件

点击1 --> 在2处输入“view in browser” --> 选择3,安装即可。
在文件处,鼠标右键,可以看到【view in browser】这一栏了。

VS Code 如何直接在浏览器中预览页面的更多相关文章
- [转]让Sublime Text2支持浏览器中预览
转自http://www.imququ.com/post/view-sublime-text-2-file-in-browser.html 1.点击菜单Tools -> New Plugin.. ...
- 如何将Emmet安装到到 Sublime text 3?第二部分该插件还能让我们自定义快捷键呼出某个浏览器以预览页面
看清楚哦~~这是Sublime text 3不是2的版本,两者的安装还是有区别的,下面的方法是我感觉比较简单的,其他的要命令什么的感觉太复杂了,经测试是OK的. 先关闭Sublime text 3: ...
- 设置sublime text2/3中预览浏览器快捷键的方法
我们为什么要设置默认的预览浏览器呢?因为搞前端的都知道,你在预览的时候不可能只预览一个浏览器,可能需要多个,当然今天我们举例中会说道谷歌浏览器Chrome,IE浏览器Internet Explorer ...
- sublime text3 自己定义的不同浏览器的预览快捷键
sublime text3 自己定义的不同浏览器的预览快捷键突然全部失效了,搞到现在一直没闹清楚怎么回事,翻看插件发现SideBarEnhancements这插件刚更新了,快捷键也是依赖这个插件弄得. ...
- sublime text2-text3 定义的不同浏览器的预览快捷键
sublime text3 自己定义的不同浏览器的预览快捷键突然全部失效了,搞到现在一直没闹清楚怎么回事,翻看插件发现SideBarEnhancements这插件刚更新了,快捷键也是依赖这个插件弄得. ...
- Dynamics AX 2012 R2 SSRS报表在VS2010中预览没有数据
今天,Reinhard 在VS中制作SSRS报表,预览的时候发现显示不出数据. 仔细检查了数据处理环节和临时表里的数据,都发现没有问题. 用同事的账号登陆同样的开发环境,发现他的账号可以在VS中预览到 ...
- Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览
github地址:https://github.com/Liaozhenting/template 使用的是ejs的语法.其实你用什么文件后缀都可以,都是按ejs来解析. 模板文件放在componen ...
- 在网页中预览excel表格文件
项目需求在前端页面中实现预览excel表格的功能,上网了解之后大致总结为一下几种方法. 1.office文档转换为pdf,再转swf,然后通过网页加载flash进行预览 2.通过 xlsx.js,js ...
- vs2017/vs2019 去掉 单击aspx文件预览页面
初次安装vs2017或者vs2019,新建的项目中,每次单击项目文件时,文件自动打开了 然后 打开 工具->选项->环境->选项卡和窗口->预览选项卡->勾掉" ...
随机推荐
- 数据仓库和ETL建设
这个是Ralph kimball ETL的书籍,其中第10章主要讲如何管理数据仓库团队,ETL团队是属于数据仓库团队的:第一章和第二章是概况性的介绍,强烈建议大家都看下1/2/10章,对于大家形成对数 ...
- django 学习之model操作(想细化)
一.Field选项 null=True 数据库为空 blank=True admin相关为空 choices:choices意味着静态数据的变化不会太大. db_column: 用于此字段的数据库的列 ...
- Atitit 项目的主体设计与结构文档 v5
Atitit 项目的主体设计与结构文档 v5 1. 版本历史说明2 2. 功能大概说明2 3. 实现的目标3 3.1. cross device跨设备(pc 手机 平板)3 3.2. cross sc ...
- iOS7隐藏状态栏 status Bar
转自:http://blog.csdn.net/dqjyong/article/details/17896145 IOS7中,不仅应用的风格有一定的变化,状态栏变化比较大,我们可以看到UIVIEWCO ...
- JavaWEB springmvc 使用定时任务
1.配置web.xml 在web.xml配置使用springmvc框架,其他配置略. <display-name>xxx.com</display-name> <!-- ...
- crontab -e 新法
SHELL=/bin/sh PATH=/sbin:/bin:/usr/sbin:/usr/bin MAILTO=root 0 3 * * * /home/rsync.sh //每天晚上3点执行一次同步 ...
- 数据库存储引擎 show engines 修改引擎
mysql> show engines; +--------------------+---------+-------------------------------------------- ...
- HTML5学习笔记(二十五):事件
在浏览器或文档某个元素发生某个特定情况的瞬间,会作为一个事件进行广播,我们可以对其添加监听来处理特定的事件. 事件流 事件流描述了页面中接收事件的顺序. 整个事件流包含了三个阶段:事件捕获阶段.事件目 ...
- how-apache-flink-enables-new-streaming-applications-part-1
https://data-artisans.com/blog/how-apache-flink-enables-new-streaming-applications-part-1 http://www ...
- vue.js中请求数据v-for循环使用数据
1.效果图 2.cart.json { "message":"", "status":"1", "result ...