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 如何直接在浏览器中预览页面的更多相关文章

  1. [转]让Sublime Text2支持浏览器中预览

    转自http://www.imququ.com/post/view-sublime-text-2-file-in-browser.html 1.点击菜单Tools -> New Plugin.. ...

  2. 如何将Emmet安装到到 Sublime text 3?第二部分该插件还能让我们自定义快捷键呼出某个浏览器以预览页面

    看清楚哦~~这是Sublime text 3不是2的版本,两者的安装还是有区别的,下面的方法是我感觉比较简单的,其他的要命令什么的感觉太复杂了,经测试是OK的. 先关闭Sublime text 3: ...

  3. 设置sublime text2/3中预览浏览器快捷键的方法

    我们为什么要设置默认的预览浏览器呢?因为搞前端的都知道,你在预览的时候不可能只预览一个浏览器,可能需要多个,当然今天我们举例中会说道谷歌浏览器Chrome,IE浏览器Internet Explorer ...

  4. sublime text3 自己定义的不同浏览器的预览快捷键

    sublime text3 自己定义的不同浏览器的预览快捷键突然全部失效了,搞到现在一直没闹清楚怎么回事,翻看插件发现SideBarEnhancements这插件刚更新了,快捷键也是依赖这个插件弄得. ...

  5. sublime text2-text3 定义的不同浏览器的预览快捷键

    sublime text3 自己定义的不同浏览器的预览快捷键突然全部失效了,搞到现在一直没闹清楚怎么回事,翻看插件发现SideBarEnhancements这插件刚更新了,快捷键也是依赖这个插件弄得. ...

  6. Dynamics AX 2012 R2 SSRS报表在VS2010中预览没有数据

    今天,Reinhard 在VS中制作SSRS报表,预览的时候发现显示不出数据. 仔细检查了数据处理环节和临时表里的数据,都发现没有问题. 用同事的账号登陆同样的开发环境,发现他的账号可以在VS中预览到 ...

  7. Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览

    github地址:https://github.com/Liaozhenting/template 使用的是ejs的语法.其实你用什么文件后缀都可以,都是按ejs来解析. 模板文件放在componen ...

  8. 在网页中预览excel表格文件

    项目需求在前端页面中实现预览excel表格的功能,上网了解之后大致总结为一下几种方法. 1.office文档转换为pdf,再转swf,然后通过网页加载flash进行预览 2.通过 xlsx.js,js ...

  9. vs2017/vs2019 去掉 单击aspx文件预览页面

    初次安装vs2017或者vs2019,新建的项目中,每次单击项目文件时,文件自动打开了 然后 打开 工具->选项->环境->选项卡和窗口->预览选项卡->勾掉" ...

随机推荐

  1. JDK1.6新特性,网络增强(Networking features and enhancements)

    参考: http://docs.oracle.com/javase/6/docs/technotes/guides/net/enhancements-6.0.html http://blog.csdn ...

  2. MyEclipse中设置jsp页面为默认utf-8编码

    转自:http://www.cnblogs.com/xdp-gacl/p/3496161.html 在MyEclispe中创建Jsp页面,Jsp页面的默认编码是“ISO-8859-1”,如下图所示: ...

  3. android:3D垂直翻转动画-FlipAnimation

    需求 对ImageView进行相似于翻纸牌的动画 解决 各种Animator的组合 第一步动画: 动画代码文件1,card_flip_left_out.xml <? xml version=&q ...

  4. 安卓数据解析之 fastjson 的解析以及Gson解析

    在安卓开发过程中的.我们经常使用的数据传递是以json格式传递.安卓 亲爹提供了我们Gson解析工具.点击下载Gson.jar 阿里巴巴FastJson是一个Json处理工具包,包含"序列化 ...

  5. NLP资料

    https://towardsdatascience.com/how-to-get-started-in-nlp-6a62aa4eaeff?source=rss-299377188126------3

  6. React 设计思想

    https://github.com/react-guide/react-basic React 设计思想 译者序:本文是 React 核心开发者.有 React API 终结者之称的 Sebasti ...

  7. Mac安装mtr与brow安装

    Mac安装mtr与brow安装 Mac里比较好的安装mtr方式是用Homebrew 或者MacPorts,本来想安装Homebrew,但大概是GFW的问题,下载地址无法访问,因为没有全局FQ,暂时不考 ...

  8. IntelliJ IDEA中的properties文件乱码转成中文[unicode码转中文]

    在IntelliJ IDEA中,一些.properties后缀的配置文件中的中文常常会是下面的样子,看不懂怎么办? 解决办法:File-->Settings-->File Encoding ...

  9. 关于Android开发的一些个人总结(2016.04)

    引言 本文主要目标是整理下我在2016年第一季度针对Android学习的内容,不会深入细节,只是简单聊聊框架以及学习的方法. 我的Android之路 因为之前对Android有一个简单的接触,研究生期 ...

  10. 【密码学】RSA公钥密码体制

    RSA公钥密码体制是美国麻省理工学院(MIT)的三位科学家Rivest.Shamir.Adleman于1978年提出的,简称RSA公钥秘密系统.实际上,RSA稍后于MH背包公钥密码实用系统,但它的影响 ...