VS Code安装及使用(附常用插件安装)(图文详解)(1)

官网上有几个不同的VS Code版本,安装使用区别不大。下面因为多几个安装插件的步骤,所以篇幅略长,插件的安装根据个人需要进行选择安装


下载地址

官网地址:https://code.visualstudio.com/点击访问


一、软件下载

1.进入官网,点击下拉框下载Windows ×64 User Installer(Insiders)版本。

在这里插入图片描述
2.若是点击官网右上角的下载,User Installer和System Installer两个版本在安装和使用上几乎无差别,电脑是32位的,下载32bit版本。

在这里插入图片描述

二、软件安装

3.双击打开。

在这里插入图片描述
4.选择我同意,点击下一步。

在这里插入图片描述
5.选择安装路径,点击下一步。

在这里插入图片描述
6.点击下一步。

在这里插入图片描述

扫描二维码关注公众号,回复: 12076267 查看本文章

7.勾选图片中的选择,点击下一步。

在这里插入图片描述
8.点击安装。

在这里插入图片描述
9.安装成功。

在这里插入图片描述

三、插件安装

下面安装几个常用的插件,方便我们开发时用。

1.中文版操作界面插件

10.安装成功后,打开软件是英文版的。

在这里插入图片描述
11.安装中文版插件,点击小图标,在输入框中输入Chinese后,点击Intall。

在这里插入图片描述
12.右下角显示插件安装成功后,重启即可。

在这里插入图片描述
13.再打开就是中文操作界面了。

在这里插入图片描述

2.快速浏览网页插件

14.没有安装该插件时,点击F5运行网页后,还要多一步选择浏览器,以及右键情况。

在这里插入图片描述在这里插入图片描述
15.安装open in browser插件。

在这里插入图片描述
16.安装后右键情况,这时就可以Alt+B快捷键访问网页了。

在这里插入图片描述

3.LiveServer服务器插件

17.安装Live Server插件。

在这里插入图片描述
18.安装成功后,点击右键Open with Live Server,插件会将网页部署到服务器,让我们更加接近一个真实开发环境,可以看到打开网页的地址是一个服务器地址。

在这里插入图片描述
19.服务器插件还有个便捷地方,我们写完代码后,点击保存服务器会自动更新网页内容,无需我们重新刷新网页。但还可以更方便,点击左下角设置图标,再点击设置,将Auto Save设置为afterDelay,最后设置延迟时间。这时写完代码,VS Code自动保存文件,服务器更新网页内容,便有个实时效果。

在这里插入图片描述

4.Ayu外观主题插件

20.安装Ayu插件。

在这里插入图片描述
21.安装完成后,即可选择主题。

在这里插入图片描述
22.后面想重新设置主题的话,先进入插件栏,再点击小图标,点击设置主题即可。

在这里插入图片描述


小结

本篇博客主要说了:

1.下载VS Code安装包并进行安装,官网上列举的那几个版本都行。
2.安装中文版操作界面,极大方便了我这种英语渣渣。
3.安装open in browser插件,便于快速浏览网页。
4.安装Live Server插件,便于我们接近真实开发环境。
5.安装Ayu外观主题插件,某一主题用久了,突然换个外观主题,心情都更舒畅了。

上面插件根据需要安装即可,最后谢谢浏览,欢迎三连!

猜你喜欢

转载自blog.csdn.net/weixin_45336315/article/details/109287240
今日推荐