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.点击下一步。

在这里插入图片描述

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