VisualStudio Code 安装 及常用插件

首先检查电脑位数64还是32，在电脑桌面---鼠标右键单击 此电脑---属性 ---系统类型

 

官网下载页面：https://code.visualstudio.com/Download

一：同意协议

二：选择安装路径

英文路径，默认C盘也可以

默认安装路径为C:\users\用户名\AppData\Local\Programs\Microsoft VS Code

三：在开始菜单文件夹中创建VSCode的快捷方式

可以不创建开始菜单文件夹
这一步无论你如何选择，实际上几乎不影响你使用VS Code
 

四：一些很有用的设置

 

效果一：创建桌面快捷方式
桌面上将出现该VSCode的快捷方式

效果二：将“通过Code打开”操作添加到 Windows 资源管理器文件上下文菜单
选中任意文件，点击鼠标右键

可以直接通过VSCode打开该文件

效果三：将“通过Code打开”操作添加到 Windows 资源管理器目录上下文菜单
选中任意文件夹，点击鼠标右键

可以直接通过VSCode打开该文件夹

将VS Code的打开操作添加到文件、文件夹的右键菜单中，会给我们的操作带来极大的方便

效果四：将Code注册为受支持的文件类型的编辑器
对于受支持文件类型的文件，可以右键 > 打开方式 > Visual Studio Code

来用VSCode打开该文件

效果五：添加到PATH

将VSCode添加到环境变量Path中，可以在控制台（cmd或power shell）中输入code打开VS Code

如何继续下一步·，等待安装完成

##必备插件

Chinese（简体中文）

   vscode默认是英文，可安装Chinese 插件 实现中文版本

 

vscode-icons (侧边栏图标插件)

       可以实现对各种文件类型的文件前的图标进行优化显示，这样我们在查看长长的文件列表的时候，可以直接通过文件的图标就可以快速知道文件的类型，

AutoFileName (文件路径自动补全插件)

当你需要 require 本地文件时，这个插件将为你提供基于你输入的文件路径的自动补全的选项。

Beautify

　　格式化代码

open in browser

　　vscode不像IDE一样能够直接在浏览器中打开html，而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件，支持自定义打开指定的浏览器，包括：Firefox，Chrome，Opera，IE以及Safari

Open in Browser

1.使用快捷键 Alt+B

2.右键在浏览器中查看

Vetur （vue2）

　　Vue多功能集成插件，包括：语法高亮，智能提示，emmet，错误提示，格式化，自动补全，debugger。vscode官方钦定Vue插件，Vue开发者必备。

 Volar （vue3）

 snippets　

React/Redux/react-router语法智能提示