Skip to content

Commit

Permalink
update:VS Code使用教程
Browse files Browse the repository at this point in the history
  • Loading branch information
qianguyihao committed Apr 18, 2019
1 parent eaf0fb4 commit d3e66b3
Showing 1 changed file with 12 additions and 6 deletions.
18 changes: 12 additions & 6 deletions 00-前端工具/01-VS Code的使用.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@

## 前言

> 本文首发于博客园。最新内容将在[GitHub](https://github.com/qianguyihao/Web)上实时更新。欢迎在GitHub上关注我,一起入门和进阶前端
> 本文首发于[博客园](https://www.cnblogs.com/qianguyihao/p/10732375.html)。最新内容将在[GitHub](https://github.com/qianguyihao/Web/blob/master/00-%E5%89%8D%E7%AB%AF%E5%B7%A5%E5%85%B7/01-VS%20Code%E7%9A%84%E4%BD%BF%E7%94%A8.md)上实时更新。
VS Code 本来是前端人员专用,但由于它实在是太好用了,于是,各种开发方向的码农也正在用 VS Code 作为他们的主力编程工具。甚至是一些写作的同学,也把 VS Code 作为 markdown 写作工具。

Expand Down Expand Up @@ -59,6 +59,8 @@ VS Code 的安装很简单,直接去官网下载安装包,然后双击安装

VS Code用得熟不熟,首先就看你是否会用快捷键。以下列出的内容,都是常用快捷键,而加粗部分的快捷键,使用频率则非常高。

掌握10%的内容,足矣应对90%的工作。熟练使用它们,你就已经很牛了。

### 移动光标

| Mac快捷键 | Win快捷键 | 作用 | 备注 |
Expand Down Expand Up @@ -163,7 +165,7 @@ VS Code用得熟不熟,首先就看你是否会用快捷键。以下列出的

上图中,将红框部分打钩即可。

设置成功后,我们就可以查看到当前文件的「层级结构」,非常方便。
设置成功后,我们就可以查看到当前文件的「层级结构」,非常方便。如下图所示:

![](http://img.smyhvae.com/20190415_2009.png)

Expand All @@ -173,6 +175,8 @@ VS Code 默认显示代码的行号。你可以在设置项里搜索 `editor.lin

![](http://img.smyhvae.com/20190417_2140.png)

我建议保留这个设置项,无需修改。

### 右侧是否显示代码的缩略图

VS Code 会在代码的右侧,默认显示缩略图。你可以在设置项里搜索 `editor.minimap`进行设置,配置项如下:
Expand Down Expand Up @@ -203,7 +207,7 @@ VS Code 会根据你所打开的文件来决定该使用空格还是制表。也

![](http://img.smyhvae.com/20190417_2209.png)

### 改完代码后立即保存
### 改完代码后立即自动保存

改完代码后,默认不会自动保存。你可以在设置项里搜索`files.autoSave`,修改配置项如下:

Expand Down Expand Up @@ -317,6 +321,8 @@ VS Code自带的对比功能并不够强大,我们可以安装插件`compareit

![](http://img.smyhvae.com/20190415_2116.png)

正常情况下,我建议这个设置项不用勾选。

### 全局搜索

在上面的快捷键列表中,我们已经知道如下快捷键:
Expand Down Expand Up @@ -372,7 +378,7 @@ VS Code 自带了 Git 版本管理,如下图所示:

### 自带终端

我们可以按下「Ctrl + `」打开 VS Code 自带的终端。我认为内置终端并没有那么好用,我更建议你使用第三方的终端 **item2**
我们可以按下「Ctrl + `」打开 VS Code 自带的终端。我认为内置终端并没有那么好用,我更建议你使用第三方的终端 **item2**

### markdown语法支持

Expand Down Expand Up @@ -530,7 +536,7 @@ GitLens 在 Git 管理上有很多强大的功能,比如:

- 地址:<https://github.com/shanalikhan/code-settings-sync>

- 作用:多台设备之间,同步 VS Code 配置。[]
- 作用:多台设备之间,同步 VS Code 配置。

### vscode-pigments

Expand All @@ -546,5 +552,5 @@ css颜色高亮显示。

如果你有什么推荐的 VS Code 插件,欢迎留言。

同时,你也可以关注我在 GitHub 上的[前端入门](https://github.com/qianguyihao/Web)项目,超级详细和真诚。
同时,你也可以关注我在 GitHub 上的 [前端入门项目](https://github.com/qianguyihao/Web),超级详细和真诚。

0 comments on commit d3e66b3

Please sign in to comment.