史上最全VSCode插件,怪不得写代码头疼,VSCod安装与配置(适合小白)

简介: 史上最全VSCode插件,怪不得写代码头疼,VSCod安装与配置(适合小白)

@[toc]

一、什么是VSCode?

  VS Code的全称是Visual Studio Code,但这全名实在是太长了,很多用户喜欢叫它VS Code。说起VS Code,官方定义它是一个免费的、开源的跨平台编辑器。之所以强调“编辑器”,我想是因为 VS Code 并无意成为一个全尺寸的集成开发环境,也就是IDE。
  很多人都把编辑器等同于IDE,其实从专业角度来讲并非这样。IDE 更为关注开箱即用的编程体验、对代码往往有很好的智能理解,同时侧重于工程项目,为代码调试、测试、工作流等都有图形化界面的支持,因此相对笨重,Java程序员常用的Eclipse定位就是IDE;而编辑器则相对更轻量,侧重于文件或者文件夹,语言和工作流的支持更丰富和自由,VS Code 把自己定位在编辑器这个方向上,但又不完全局限于此。
  如果你有兴趣,可以打开自己喜欢的编辑器官网看看它是怎么样的定位。总体来说,近几年流行风向是轻量的编辑器,这也是大势所趋。
  要理解VS Code代码编辑器的设计思路,就需要先看看VS Code的发展轨迹。从我的角度看,不管你是学习编程语言,还是框架、编辑器,都应该先去看看它的来龙去脉,了解它们是怎么发展而来的,曾经遇到了什么问题,又是怎么解决的,这些信息都便于你从大局上提高对事情本质的认识。
VSCode官网https://code.visualstudio.com/

二、版本

当前最新版:1.45 2020年4月
版本列表https://code.visualstudio.com/updates/v1_45

三、下载

VSCode下载https://code.visualstudio.com/Download
这里推荐大家下载Zip解压版
大家根据自己系统版本来下载,我在这里下载64bit
在这里插入图片描述

四、安装

下载完成后D盘新建web文件夹,将下载的文件放进web文件夹在这里插入图片描述
解压,为方便以后更新版本,修改文件名为VSCode
在这里插入图片描述
双击进入VSCode文件夹,在此目录下新建data文件夹,此目录存放插件。
在这里插入图片描述
双击Code.exe即可打开VSCode
在这里插入图片描述
下面就可以正常使用了

五、插件安装

点击左边地五个图标可以安装插件,这里推荐一些插件,
在这里插入图片描述

1.Codelf

变量命名神器
在这里插入图片描述

2、View In Browser

在浏览器里面预览正在编辑的html文件
在这里插入图片描述

3、Color Highlight

高亮显示样式颜色
在这里插入图片描述

4、Bracket Pair Colorizer

成对的彩色括号,让括号拥有独立的颜色,便于区分
在这里插入图片描述

5、Highlight Matching Tag

高亮显示对应的HTML标签以及标识出对应的各种括号
在这里插入图片描述

6、Path Intellisense

在编辑器中输入路径的时候,能自动补全
在这里插入图片描述

7、Prettier - Code formatter

格式化代码
在这里插入图片描述

8、Auto Close Tag

自动补全标签
在这里插入图片描述

9、Auto Rename Tag

自动重命名html标签,如修改p标签为a,将自动修改结尾标签p为a
在这里插入图片描述

10、HTML Snippets

智能提示HTML标签,以及标签的含义
在这里插入图片描述

11、HTML CSS Support

在HTML标签上写Class的时候能够智能提示当前所支持的样式
在这里插入图片描述

12、indent-rainbow

带颜色的缩进
在这里插入图片描述

13、change-case

转换命名风格
在这里插入图片描述

六、总结

插件大家根据个人需要进行下载
VSCode需要配合Git,下篇文章为大家介绍Git安装与配置
这里为大家附上VSCode使用教程https://geek-docs.com/vscode/vscode-tutorials/what-is-vscode.html
VSCode汉化


博主其他文章:
Windows下JDK安装与配置(超详细,图文详解、适合小白查看)
史上最详细的Java基础知识总结(入门一)
史上最详细的Java基础知识总结(入门二)


由于水平有限,本博客难免有不足,恳请各位大佬不吝赐教!

相关文章
|
1月前
|
Ubuntu Linux C语言
Ubuntu下安装vscode,并解决终端打不开vscode的问题
Ubuntu下安装vscode,并解决终端打不开vscode的问题
134 0
|
1月前
|
人工智能 自然语言处理 算法
国产新型AI编程助手—DevChat AI插件在VSCode中的应用
国产新型AI编程助手—DevChat AI插件在VSCode中的应用
|
10天前
设置VSCode代码编辑器右侧的Minimap代码缩略图滚动条切换显示、隐藏的快捷键Alt+M
设置VSCode代码编辑器右侧的Minimap代码缩略图滚动条切换显示、隐藏的快捷键Alt+M
|
2月前
|
缓存 JavaScript 开发工具
【安装指南】VSCode搭建运行Vue的详细教程
【安装指南】VSCode搭建运行Vue的详细教程
495 0
|
3月前
|
人工智能 JavaScript 程序员
Fitten Code:在VSCode插件市场备受欢迎的原因是什么?
随着AI技术的不断发展,AI在编写代码方面的能力也日益强大。充分利用AI的能力能够显著提高代码编写的效率和质量。今天我将向大家介绍一款备受瞩目的AI代码神器——Fitten Code,让我们一同揭开它神秘的面纱!
243 3
|
11天前
|
人工智能 NoSQL 机器人
【C++】VS code如何配置使用C++(手把手教学)
【C++】VS code如何配置使用C++(手把手教学)
|
11天前
Vscode 插件-代码敲出不同的特效
Vscode 插件-代码敲出不同的特效
|
1月前
|
NoSQL 关系型数据库 开发工具
最新最全 VSCODE 插件推荐(2023版)
最新最全 VSCODE 插件推荐(2023版)
102 0
|
1月前
|
Java
VSCode 插件Code Runner 中文提示乱码
VSCode 插件Code Runner 中文提示乱码
|
1月前
|
开发者