我的 Visual Studio Code 设置
本文也可在iamdeveloper.com上找到。
这原本只是一个概要，但我认为把它转换成一篇博客文章更有意义。
正如今年stateofjs.com 的调查所指出的那样，Visual Studio Code 正在迅速成为许多 Web 开发人员的首选编辑器。
VS Code是我的首选编辑器。它非常适合 Web 开发，如果你使用TypeScript开发，那它绝对是最佳选择。有趣的是……它本身就是用 TypeScript 编写的。如果你有兴趣了解更多关于 TypeScript 的信息，可以看看我的博客文章《考虑使用 TypeScript》。
TypeScript 为 VS Code 提供了重构和智能感知功能。更棒的是，即使你没有通过自动类型获取来使用 TypeScript，也能获得类型化的智能感知。
好了，我们开始吧。这是我当前的Visual Studio Code配置。
扩展
VS Code 的应用市场提供了海量的扩展程序。除了扩展程序之外，2017 年还推出了扩展包。简而言之，扩展包是扩展程序的集合。
Settings Sync是一款必备的扩展程序，我强烈建议您将其作为首选扩展程序安装。有了这款扩展程序，您可以将大部分设置备份到私有 gist 中。之后，恢复设置也非常简单。它非常适合备份设置以及同步设置，我经常在我的工作笔记本电脑和个人笔记本电脑之间使用这项功能。
Node/JS
格式化/代码检查
CSS
调试
安装 Go 和 Python 等语言扩展（见下文）后，VS Code 会自动配置所有必要的工具，以便针对这些特定语言进行调试。以下是一些其他语言的扩展。开始调试最简单的方法是按下快捷键F5，VS Code 会提供调试配置选项供您选择。
Git
单元测试
React
其他语言
REPLs/游乐场
- Quokka.js（请查看Quokka 简介……）
观众
DevOps相关内容
破解编辑器
- 指南
- 自定义 CSS 和 JS 加载器（目前用于Cobalt 2 主题。）
2018年1月28日更新：自定义 CSS 和 JS 加载器还可以通过使用两种字体来实现类似 Operator Mono 的外观。请参阅下面的推文。不过，我遇到了一些问题。主要问题是 CSS 类名发生了变化。请阅读整个推文串以获取所有信息。
简而言之；请查看https://gist.github.com/nickytonline/8086319bf5836797ee3dea802a77000d。（也许可以再写一篇博客文章？😉）。最终效果就是这样。我还不确定是否喜欢代码中的草书字体，但也许以后会慢慢习惯。
各种各样的
主题
当前主题设置
我目前正在试用Cobalt 2主题搭配 Fish Shell Fisherman Agnoster 主题。
我仍然很喜欢将德古拉主题与鱼壳渔夫小丑主题搭配使用，但我想稍微换个风格。
我还用过One Dark Pro和Material 主题，它们也都很棒。
壳
我目前使用的是Fish Shell和Fisherman主题，搭配 Agnoster 主题。
字体
我在 VS Code 中使用Fira Code 。安装好 Fira Code 之后，在 Code 中进行设置非常简单。
打开用户设置并添加以下内容：
// Controls the font family.
"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true,
// Controls the font size.
"editor.fontSize": 14,
搞定！你现在拥有了 Fira Code 及其所有令人惊叹的连字功能（这是个词吗？）。
自定义按键绑定
// Place your key bindings in this file to overwrite the defaults
[
{
"key": "cmd+shift+z",
"command": "workbench.action.terminal.focus"
},
{
"key": "cmd+shift+a",
"command": "workbench.action.terminal.focusNext"
},
{
"key": "cmd+shift+s",
"command": "workbench.action.terminal.focusPrevious"
},
{
"key": "cmd+shift+x",
"command": "workbench.action.terminal.kill"
}
]
另外，如果您想了解 Visual Studio Code 的实用技巧，请访问www.vscodetips.com。最后，我非常期待Live Share的上线。
有任何问题或评论？请在推特上联系我。
文章来源：https://dev.to/nickytonline/my-visual-studio-code-setup-2ima