update:VS Code使用教程
This commit is contained in:
parent
eaf0fb4004
commit
d3e66b3ef6
@ -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 写作工具。
|
||||
|
||||
@ -59,6 +59,8 @@ VS Code 的安装很简单,直接去官网下载安装包,然后双击安装
|
||||
|
||||
VS Code用得熟不熟,首先就看你是否会用快捷键。以下列出的内容,都是常用快捷键,而加粗部分的快捷键,使用频率则非常高。
|
||||
|
||||
掌握10%的内容,足矣应对90%的工作。熟练使用它们,你就已经很牛了。
|
||||
|
||||
### 移动光标
|
||||
|
||||
| Mac快捷键 | Win快捷键 | 作用 | 备注 |
|
||||
@ -163,7 +165,7 @@ VS Code用得熟不熟,首先就看你是否会用快捷键。以下列出的
|
||||
|
||||
上图中,将红框部分打钩即可。
|
||||
|
||||
设置成功后,我们就可以查看到当前文件的「层级结构」,非常方便。
|
||||
设置成功后,我们就可以查看到当前文件的「层级结构」,非常方便。如下图所示:
|
||||
|
||||
![](http://img.smyhvae.com/20190415_2009.png)
|
||||
|
||||
@ -173,6 +175,8 @@ VS Code 默认显示代码的行号。你可以在设置项里搜索 `editor.lin
|
||||
|
||||
![](http://img.smyhvae.com/20190417_2140.png)
|
||||
|
||||
我建议保留这个设置项,无需修改。
|
||||
|
||||
### 右侧是否显示代码的缩略图
|
||||
|
||||
VS Code 会在代码的右侧,默认显示缩略图。你可以在设置项里搜索 `editor.minimap`进行设置,配置项如下:
|
||||
@ -203,7 +207,7 @@ VS Code 会根据你所打开的文件来决定该使用空格还是制表。也
|
||||
|
||||
![](http://img.smyhvae.com/20190417_2209.png)
|
||||
|
||||
### 改完代码后立即保存
|
||||
### 改完代码后立即自动保存
|
||||
|
||||
改完代码后,默认不会自动保存。你可以在设置项里搜索`files.autoSave`,修改配置项如下:
|
||||
|
||||
@ -317,6 +321,8 @@ VS Code自带的对比功能并不够强大,我们可以安装插件`compareit
|
||||
|
||||
![](http://img.smyhvae.com/20190415_2116.png)
|
||||
|
||||
正常情况下,我建议这个设置项不用勾选。
|
||||
|
||||
### 全局搜索
|
||||
|
||||
在上面的快捷键列表中,我们已经知道如下快捷键:
|
||||
@ -372,7 +378,7 @@ VS Code 自带了 Git 版本管理,如下图所示:
|
||||
|
||||
### 自带终端
|
||||
|
||||
我们可以按下「Ctrl + `」打开 VS Code 自带的终端。我认为内置终端并没有那么好用,我更建议你使用第三方的终端 **item2**,
|
||||
我们可以按下「Ctrl + `」打开 VS Code 自带的终端。我认为内置终端并没有那么好用,我更建议你使用第三方的终端 **item2**。
|
||||
|
||||
### markdown语法支持
|
||||
|
||||
@ -530,7 +536,7 @@ GitLens 在 Git 管理上有很多强大的功能,比如:
|
||||
|
||||
- 地址:<https://github.com/shanalikhan/code-settings-sync>
|
||||
|
||||
- 作用:多台设备之间,同步 VS Code 配置。[荐]
|
||||
- 作用:多台设备之间,同步 VS Code 配置。
|
||||
|
||||
### vscode-pigments
|
||||
|
||||
@ -546,5 +552,5 @@ css颜色高亮显示。
|
||||
|
||||
如果你有什么推荐的 VS Code 插件,欢迎留言。
|
||||
|
||||
同时,你也可以关注我在 GitHub 上的[前端入门](https://github.com/qianguyihao/Web)项目,超级详细和真诚。
|
||||
同时,你也可以关注我在 GitHub 上的 [前端入门项目](https://github.com/qianguyihao/Web),超级详细和真诚。
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user