VSCode(Visual Studio Code)是由微软研发的一款免费、开源的跨平台文本(代码)编辑器,算是目前前端开发几乎完美的软件开发工具。
1.VSCode下载

VSCode下载链接: https://code.visualstudio.com/
2.VSCode汉化

3.VSCode常用插件(安装步骤同汉化)
3.1 Auto Close Tag (自动闭合HTML/XML标签)


3.2 Auto Rename Tag (自动完成另一侧标签的同步修改)


3.3 Beautify (格式化 html ,js,css)

3.4 Bracket Pair Colorizer(给括号加上不同的颜色,便于区分不同的区块)


3.5 Debugger for Chrome(映射vscode上的断点到chrome上,方便调试)


3.6 ESLint(js语法纠错,可以自定义配置)


3.7 GitLens(方便查看git日志)


3.8 HTML CSS Support (智能提示CSS类名以及id)

3.9 HTML Snippets(智能提示HTML标签,以及标签含义)


3.10 JavaScript(ES6) code snippets(ES6语法智能提示,以及快速输入)


3.11 jQuery Code Snippets(jQuery代码智能提示)


3.12 Markdown Preview Enhanced(实时预览markdown)


3.13 markdownlint(markdown语法纠错)


3.14 Material Icon Theme(vscode图标主题)


3.15 Icon fonts(图标字体)


3.16 open in browser(右键快速在浏览器中打开html文件)


3.17 Path Intellisense(自动提示文件路径)


3.18 React/Redux/react-router Snippets(React/Redux/react-router语法智能提示)


3.19 Vetur(Vue多功能集成插件,错误提示等)


3.20 Class autocomplete for HTML(智能提示HTML class =“”属性)


3.21 npm Intellisense(require 时的包提示)

3.22将所写的东西在浏览器中显示快捷键:Shift+Alt+B选择一个浏览器打开(此处注意文件必须是 .HTML文件,不然不会显示内容)

例如我在VC上随便写一个东西,然后用浏览器打开,以下两个图为我的操作

3.23 设置用滑轮改变字体的大小和更改vscode默认浏览器的方法

1.点击文件-首选项-设置:到达如下图所示

点击上图所示箭头,进入如下图,并输入这两行,然后ctrl+s保存后就可以用滑轮改变字体大小,并且可以更改你的默认浏览器

4.VSCode快捷键
4.1 左侧是按键,右侧是功能(下同)


4.2 基础编辑


4.3 导航


4.4 搜索和替换


4.5 多光标和选择


4.6 语言编辑


4.7 编辑器管理


4.8 文件管理


4.9 显示


4.10 调试


4.11 集成终端

4.12调节vscode的背景颜色快捷键 ctrl+k然后在按ctrl+t

4.13 打开浏览器 alt+b;保存Ctrl+s
本文作者:Yaphets.Lee

VSCode下载及各种实用插件安装教程相关推荐

  1. Pycharm汉化,Pycharm怎么改成汉语,手把手教学,超详细(汉语插件安装教程)

    pycharm汉化 pycharm怎么改成汉语,手把手教学,超详细(汉语插件安装教程) 首先,打开 pycharm.然后点击左上角File(文件)会弹出如下页面继续点击蓝色位置Settings-(设 ...

  2. wordpress html插件安装,WordPress 插件安装教程及方法

    WordPress 拥有极其强大的功能,也有越来越多喜欢和使用 WordPress 的朋友,更有许多优秀的 WordPress 开发者,该如何安装 WordPress 插件呢? WordPress 本 ...

  3. ps一键滤镜网红文艺小清新VSCO全滤镜插件安装教程

    vsco是是众所周知超好用的手机滤镜,这里小编为大家带来了电脑版的ps一键滤镜网红文艺小清新VSCO全滤镜插件,vsco全套滤镜共182款,直接色彩查找,不借助ps动作,在ps上完美模拟vsco色彩, ...

  4. Mac上的ps插件安装教程:苹果电脑ps插件怎么安装

    Mac上的ps插件如何安装? 很多朋友习惯了PC平台的PS使用,一旦转到Mac平台就变成了小白一个,其中很多ps插件完全不知道如何安装. 不要着急,小编今天就给大家带来Mac上的PS插件安装教程分享. ...

  5. KeepChatGPT插件安装教程

    KeepChatGPT插件安装教程 KeepChatGPT可以让在中国通过VPN使用ChatGPT的用户更加流畅,不再出现需要刷新的问题: 具体的教程(简单到爆炸)如下: 主要有三步: 下载篡改猴的插 ...

  6. 苹果cms V10采集插件安装教程

    [苹果cms V10采集插件安装教程] 先去官网下载最新版本插件 下载下来后不去解压! 然后直接上传到程序根目录! 然后进行下面操作 安装教程 安装教程直接看图即可! 第一步先进后台的应用 第二步是点 ...

  7. vue中devTools插件安装教程

    vue-devTools 为了更方便的在开发过程中对 Vue 程序进行调试,除了传统的浏览器自带的 debug 工具以外,我们还可以通过一些专门为 Vue 提供的扩展插件来进行调试 vue-devTo ...

  8. AE插件怎么安装?ae插件.jsx安装后找不到怎么办?ae插件安装教程

    AE插件怎么安装?AE视频合成软件的功能之所以强大,是因为它装载内置插件和外置插件.内置插件编程人员在开发阶段已注入软件本身,而外置插件需要我们手动添加.有网友疑惑ae插件.jsx安装后找不到怎么办? ...

  9. Ubuntu 16.04系统实用插件安装方法

    Ubuntu 16.04系统实用插件安装方法 Ubuntu 16.04 系统实用插件安装方法链接 搜狗输入法 链接: https://blog.csdn.net/u010648921/article/ ...

最新文章

  1. Android 标签 (FlexboxLayout实现标签)
  2. Javascript:郁闷了好久终于找到原因了,原理还不明白
  3. window.onload 不执行
  4. python 编码问题
  5. 使用ABAP(ADBC)和Java(JDBC)连接SAP HANA数据库 1
  6. 用Mysql网页式管理工具安全地访问数据库的方法
  7. LwIP应用开发笔记之七:LwIP无操作系统HTTP服务器
  8. markdown格式_第1篇:如何将Markdown笔记转入ANKI复习? | 学习骇客
  9. es6 Class 的实例对象
  10. 让电脑代码满屏飞_程序员想让你的电脑死机,需要多久?
  11. jquery1.8.3和1.11.3的用法区别
  12. cogs 1111. 最短路
  13. SpringMVC框架 -- ModelAndView的用法
  14. 用计算机弹国王与乞丐,国王与乞丐 MIDI File Download :: MidiShow
  15. Kafka性能监控与优化
  16. 可恢复保险丝特性测试
  17. 阿里云RDS金融数据库(三节点版) - 案例篇
  18. layui向body添加html_layui使用教程 html引入layui教程-layui下载
  19. 【程序人生】机灵鹤六月份的月度总结
  20. 简单css实现表格头部固定

热门文章

  1. arcgis制作瓦片地图_一种GIS瓦片地图的存储方式的制作方法
  2. dsp广告和信息流广告区别_信息流广告和dsp的区别在哪?
  3. 蚂蚁笔记(Leanote) ubuntu安装教程
  4. 【笔记总结】计算机系期末复习、专业课学习、算法与其他笔记
  5. 第十一章、远程联机服务器SSH / XDMCP / VNC / RDP
  6. html文本怎么打印出来,如何把一个html文件直接打印出来(200分)
  7. 洛谷 P1348 Couple number
  8. BurpSuite专业版下载安装教程
  9. Android获取SDcard目录及创建文件夹;
  10. Windows和Linux(Ubuntu)查看电脑主机型号和序列号的命令