vscode的使用教程（插件、快捷键使用）

1.下载地址 : 点击去官网下载

2.常用插件：

View In Browser

- 预览页面（ctrl+F1）

vscode-icons

- 侧栏的图标，对于一个有视觉强迫症的人是必须要的

HTML Snippets

- 支持HTML5的标签提示

HTML CSS support

- css自动补齐

JS-CSS-HTML Formatter

格式化

jQuery Code Snippets

jquery 自动提示

Path Autocomplete

- 路径自动补齐

Npm Intellisense

- npm包代码提示

ESLint

- 检测JS必备

Debugger for Chrome

- 方便调试

Auto Rename Tag

- 自动同步修改标签

Bootstrap 3 Snippets

- bootstrap必备

Vue 2 Snippets

- vue必备

background

- 一个萌萌的插件，可以自己设置vsc的背景图

3.常用快捷键

（在快捷键部分， ⌘ 指 Command 键，⇧ 指 Shift 键，⌃ 指 Control 键，⌥ 指 Option/Alt 键。）

这里主要就是实验F1上的快捷键，一些我认为没用的我就不列出来了。

向上(下)复制行 shift + alt + top(down)

向上(下)移动行* alt + top(down)*

新建一个窗口 ctrl + shift + N

行增加缩进： ctrl + [

行减少缩进 * ctrl + ]**

裁剪尾随空格(去掉一行的末尾那些没用的空格): ctrl + shift + x

强烈建议把这个启用，这样保存的时候就会自动删掉那些没用的空格，在很多公司的代码规范里都是不允许存在这些空格的。

显示隐藏侧边栏:ctrl + B

拆分编辑器(最多拆分成三块):ctrl + /按ctrl + 1(2,3)就可以在拆分后的编辑器里切换

方法缩小ctrl +(-)

关闭编辑器 ctrl + W(F4)

切换编辑器 ctrl + shift + left(right)

也可以用 ctrl+1(2,3)

显示和隐藏侧边栏 ctrl + B

切换全屏 F11

切换自动换行 alt + Z

显示Git ctrl + shift + G

前提是你的项目必须是一个git项目

这个还是很有用的，有时候我们的屏幕不够大，可是代码没有自动换行，所以被遮住的代码就会看不到，但是你用这个快捷键就可以换行看到了。这个我是在用户设置里面设置成自动换行的。

修改用户设置

把默认的用户设置成适合我们自己的还是很重要的。

也很简单，文件 – 首选项 – 用户设置，然后出来左边的默认设置是不能改的，需要在右边settings.json中覆盖。

修改快捷键

文件 – 首选项 – 键盘快捷方式，和修改用户设置的时候一样，找到你要修改的快捷键名字，右边覆盖就可以了，一些还没有绑定快捷键的功能可以在左边的最下面看到，然后快捷键的名字就是这个。