VSCode常用知识小结

 更新时间:2020年02月21日 09:13:12   作者:Yaphets.Lee  
本文给大家汇总介绍了vscode的下载,安装,常用插件以及常用的快捷键,非常的详细,希望对大家使用vscode能够有所帮助

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 时的包提示)

在这里插入图片描述

4.VSCode快捷键 

     4.1 左侧是按键,右侧是功能(下同)

在这里插入图片描述

      4.2 基础编辑

在这里插入图片描述

      4.3 导航

在这里插入图片描述

      4.4 搜索和替换

在这里插入图片描述

      4.5 多光标和选择

在这里插入图片描述

      4.6 语言编辑

在这里插入图片描述

      4.7 编辑器管理

在这里插入图片描述

      4.8 文件管理

在这里插入图片描述

      4.9 显示

在这里插入图片描述

      4.10 调试

在这里插入图片描述

      4.11 集成终端

在这里插入图片描述

到此这篇关于VSCode常用知识小结的文章就介绍到这了,更多相关VSCode小结内容请搜素脚本之家以前的文章或下面相关文章,希望大家以后多多支持脚本之家!

相关文章

  • Git 撤销操作、删除文件和恢复文件

    Git 撤销操作、删除文件和恢复文件

    本文主要介绍了Git撤销操作、删除文件和恢复文件的方法。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • yum的基本用法和实例(推荐)

    yum的基本用法和实例(推荐)

    这篇文章主要介绍了Linux(centos8)下的yum的基本用法和实例,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-02-02
  • Alfred + Gitee搭建免费图床的使用实例详解

    Alfred + Gitee搭建免费图床的使用实例详解

    这篇文章主要为大家介绍了Alfred + Gitee搭建免费图床的使用实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • TCP协议详解_动力节点Java学院整理

    TCP协议详解_动力节点Java学院整理

    本文描述了TCP协议,首先简单介绍了TCP完成了一些什么功能;介绍了TCP报文格式,以及典型报文的数据格式。现在通过本文给大家详细介绍,感兴趣的的朋友一起看看吧
    2017-07-07
  • Git如何恢复到之前版本

    Git如何恢复到之前版本

    这篇文章主要介绍了Git如何恢复到之前版本,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • git中实现修改提交信息(版本号)

    git中实现修改提交信息(版本号)

    本文介绍了如何修改Git中的提交信息,包括修改最近一次提交和任意提交的信息,首先,使用git commit --amend命令可以快速修改最近一次的提交信息,此外,若需修改任意提交,可以通过启动交互式变基,使用reword选项重新编辑提交信息
    2024-10-10
  • 教你用PyTorch部署模型的方法

    教你用PyTorch部署模型的方法

    这篇文章主要介绍了用PyTorch部署模型的相关知识,演示了使用PyTorch最近发布的新工具torchserve来进行PyTorch模型的部署的相关知识,需要的朋友可以参考下
    2022-02-02
  • Git 教程之安装配置详解

    Git 教程之安装配置详解

    本文主要介绍Git 安装配置,这里对Linux,Windows,Mac平台的安装做了详细介绍,有需要的朋友可以参考下
    2016-09-09
  • 分享五个最佳编程字体

    分享五个最佳编程字体

    这篇文章主要介绍了分享五个最佳编程字体,需要的朋友可以参考下
    2016-10-10
  • Git commit --amend 修改提交信息操作

    Git commit --amend 修改提交信息操作

    这篇文章主要介绍了Git commit --amend 修改提交信息操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-09-09

最新评论