VSCode 的全称是 Visual Studio Code,是一款开源的、免费的、跨平台的、高性能的、轻量级的代码编辑器。它在性能、语言支持、开源社区方面,都做的很不错。
如果你作为前端工程师却还没有尝试过 VSCode,那是时候阅读 VSCode 安装 了。
常用设置项
路径面包屑
路径面包屑可以让你非常快地在文件间定位和跳转
打开 VS Code 的设置项,选择 Preferences -> Settings
,如下图所示:


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

自动保存
修改即保存,避免丢代码
改完代码后,VSCode 默认不会自动保存。你可以在设置项里搜索 files.autoSave
配置自动保存。VSCode 的自动保存模式有三种:
- afterDelay (延时保存):文件修改后延时指定时间再保存
- onFocusChange(编辑器焦点变化保存):切换编辑器标签时保存
- onWindowChange(窗口焦点变化保存):切换窗口时保存
一般无特殊需求,设置成“延时保存”即可。

文件排除
指定不显示的文件列表,保持文件树清爽干净
在设置面板中搜索 files.exclude
,打开文件排除选项,如下图所示:

通常我们会把 .git
、.svn
这些版本控制用的文件隐藏掉,避免干扰写代码。
用 VSCode 开发前端的时候,还可以把 **/*/*.map
这类 source map 文件也隐藏掉。
新建文件后的默认文件类型
新建文件后,立刻用指定的文件类型进行语法高亮
当新建文件时,VSCode 默认是纯文本类型,因此不进行语法高亮。如果你想修改默认的文件类型,可以在设置项里搜索 files.defaultLanguage
,设置项如下:

输入框里填文件类型字符串,比如 html、css、js、json 等。新建的文件就会立刻按填写的文件类型进行语法高亮了。
比如我经常需要新建临时文件写 js 片段,就可以把默认文件类型设置成 js ,避免每次新建后手动指定。
删除文件时,是否弹出确认框
当我们在 VSCode 中删除文件时,默认会弹出确认框。如果想修改设置,可以在设置项里搜索 explorer.confirmDelete
,如下图所示:

VSCode 几乎所有配置项都可以实时生效,不用重启
网友评论