广州网站制作设计:如何定制Visual Studio代码

2019.09.09 广州网站制作设计

56

Visual Studio代码 微软的新开源代码编辑器为开发人员提供了许多 很棒的特性 显著 促进源代码编辑的过程 。 此外,Visual Studio代码还确保用户使用它时就不会觉得无聊了,因为它允许他们 自定义外观的几个部分 ,例如颜色、字体、间距和文本格式,就像许多功能,例如 产品毛羽 和 validaton规则 。

在这篇文章中,首先我们将看一看 如何改变的Visual Studio代码工作区 ,那么我将向您展示如何定制默认设置的帮助下 JSON 格式化配置文件。

如何设置一个颜色主题VS代码吗

Visual Studio允许您的代码 设置一个自定义的颜色主题 为你的编辑器。

广州网站制作设计使用一个预先做好的主题,点击 文件> Preferences >颜色主题 在顶部菜单栏的菜单。 当你点击“进入”,弹出命令面板,显示一个下拉列表的主题你可以选择从。

如果你按你可以达到相同的效果 F1 打开命令面板,和类型 偏好:颜色主题 命令输入字段。

当你滚下拉列表中的选项, 工作空间更改实时的外观, 所以你可以快速查看主题最适合你的需要。

我chooe“高对比度的颜色主题,我的眼睛不是最好的。 这就是我认为的样子。

广州网站制作设计

如何安装一个主题从VS代码市场吗


如果你不喜欢任何的颜色主题VS代码提供了默认情况下,您可以下载许多其他人的 VS代码市场 。

在这里 你可以看一下目前市场上的主题。 如果你想安装一个主题从市场,打击 F1 对VS代码编辑器中打开命令面板,然后输入 ext安装 命令输入字段,最后选择 扩展:安装扩展 从弹出的列表中选择。

广州网站制作设计

广州网站制作设计当你点击这个选项,弹出命令面板的一个新实例。 输入 “ext安装主题” 命令到新输入字段,你会的 所有主题的列表 市场从VS代码可用。

Install Theme for VS Code

我选择的主题叫做“材料主题工具包”,并点击安装。 有新主题的颜色主题列表,其他默认的主题是在同一个地方,你需要 重启VS代码 。 重新启动后,新的主题出现在主题列表,你可以把它从命令面板。

新材料的主题,我的编辑现在看起来像这样:

广州网站制作设计

你可以回到之前的主题(像我一样,因为我仍然更喜欢这一主题)或者你可以玩一些与其他主题,看看哪个最适合你。

如果你愿意,你也可以 创建自定义主题 ,并发布市场通过使用VS代码 vsce 扩展管理器工具。

更改用户和工作区设置

VS代码并不只允许你设置一个自定义主题,但你也可以 配置其他设置 ,如格式规则,使用不同的特性,事故报告,HTTP设置文件关联、产品毛羽规则,等等。

你可以通过编辑两个配置文件,都在 JSON 格式。 别担心,你不需要成为一个职业,VS代码提供了一个非常简单和直观的方式快速添加您的自定义。

首先,让我们看看有什么区别这两个配置文件。 VS代码有两个范围( 全球 和 当地的 )设置,因此,两个不同的文件:

  1. 全球 settings.json ,为每个工作区配置规则是有效的

  2. 的workspace-related .vscode / settings.json ,这只是个人工作区

的 全球 settings.json 文件可以在您的操作系统的文件夹存储其他app-related配置文件,分别是:

  • 在Windows上: % APPDATA % \ \用户\ settings.json代码

  • 在Linux上: $ HOME / . config /代码/ User / settings.json

  • 在Mac: $ HOME /图书馆/应用支持/ / User / settings.json代码

的 workspace-related settings.json 文件存储在你当前的项目的文件夹。 默认情况下,这个文件不存在,但当你添加一个自定义工作区设置,VS代码创建了一个 .vscode / settings.json 文件,和地方风俗workspace-specific配置。

所以,当你使用 settings.json 文件?

如果你想VS代码来使用您的自定义配置规则 所有 您的项目,把它们融入全球 settings.json 文件。

如果你想让你的设置只在你是有效的 当前项目 到workspace-related联络即可 settings.json 文件。

工作区设置覆盖全局设置 ,所以要小心。

全局设置被称为“用户设置”VS代码。 通过单击打开 文件> Preferences >用户设置 菜单,或开始输入表达式“用户设置”命令面板(与F1打开它)。

VS代码打开相邻两个窗格:左边一个包含所有可能的选项来配置,和正确的显示了全球 settings.json文件。 你需要把你的自定义配置规则到这个文件。

广州网站制作设计

正如您可以看到的,你不需要做什么,只是复制粘贴的设置你想要改变从左边到右边,并添加修改后的值。

让我们看一看一个简短的例子(但是你可以根据你个人的需要进行其他修改)。 我将改变字体,减少的长度 选项卡 从默认四个空格2、减少工作文件的最大数量从朝九晚五,和改变CSS产品毛羽的规则重复的风格 “忽略” 来 “警告” 。

后复制粘贴,我的世界 settings.json 文件是这样的:

1
2
3.
4
5
6
7
/ /设置在这个文件覆盖默认设置
{
  “editor.fontFamily”:“快递新”,
  “editor.tabSize”:2,
  “explorer.workingFiles.maxVisible”:5
  “css.lint.duplicateProperties”:“警告”
}

广州网站制作设计在保存修改后的 settings.json 文件,看起来我的编辑器改变一次(截图只是字体的变化是可见的):

广州网站制作设计

同样你可以改变工作空间设置。 现在你需要点击 文件> Preferences >工作区设置 在顶部菜单栏访问workspace-related .vscode / settings.json 文件。

工作区设置完全相同的配置选项为用户设置,你可以使用相同的复制粘贴技术。 只有两个差异,范围(本地,而不是全局),和 settings.json 将您的自定义配置文件将被保存。


最新案例

寒枫总监

来电咨询

400-6065-301

微信咨询

寒枫总监

TOP