Visual Studio代码:版本1.14.2 (1.14.2)

按Shift + Command + P打开调色板 非macos用户按“Ctrl+P” 进入“设置。来打开设置文件。 在默认设置下，你可以看到: //显示垂直标尺的列 “editor.rulers”:[], 这意味着空数组不会显示垂直标尺。 在右侧的“用户设置”窗口，添加以下内容: “editor.rulers”:[140]

保存文件，您将看到标尺。

在v1.43中是单独为垂直标尺着色的功能。

支持多个不同颜色的标尺-(在settings.json中):

"editor.rulers": [
  {
    "column": 80,
    "color": "#ff00FF"
  },
  100,  // <- a ruler in the default color or as customized (with "editorRuler.foreground") at column 100
  {
    "column": 120,
    "color": "#ff0000"
  },
]

更改标尺的默认颜色:

"workbench.colorCustomizations": {

  "editorRuler.foreground": "#fffa"   
            // or "#ffffffaa" - the a's are alpha transparency values
}

如果你正在使用Flutter，那么你需要编辑dart的标尺，你将从RUN命令导航到文件: % APPDATA % \ \用户\ settings.json代码

把标尺设为0

就像图片。settings。json

结合kiamlaluno和Mark的答案，以及formatOnSave到Python的自动意图代码:

{
    "editor.formatOnSave": true,
    "editor.autoIndent": "advanced",
    "editor.detectIndentation": true,
    "files.insertFinalNewline": true,
    "files.trimTrailingWhitespace": true,
    "editor.formatOnPaste": true,
    "editor.multiCursorModifier": "ctrlCmd",
    "editor.snippetSuggestions": "top",
    "editor.rulers": [
        {
            "column": 79,
            "color": "#424142"
        },
        100, // <- a ruler in the default color or as customized at column 0
        {
            "column": 120,
            "color": "#ff0000"
        },
    ],

}

 

自定义VS Code的Char-len标尺:

---

因此，下面的答案比这个问题提供的其他答案要晚得多;需要注意的是，这个答案包含了其他答案所不提供的信息和内容。我将下面的问题格式化为4种配置。因此，每个配置都构建在上一个配置之上;第一个配置很简单，提供了一个简单的结果，而最后一个配置更复杂，提供了更多的东西。

为了方便起见，我在每个配置示例的底部都包含了一些图像。这些图像允许您查看配置，然后查看配置的结果。这很重要，因为如果没有这些图像，你就必须在这里和编辑器之间来回切换，才能看到每个配置的样子。

---

配置#1 |明显的单一标尺配置

---

最明显的设置是已经被建议过很多次的设置。我将在这里提到它，只是因为这是正确的开始。

将以下JSON属性添加到您的设置中。json文件。

{
    "editor.rulers": [80]
}

请注意!它可能需要你重新加载VS Code的实例(从语义上讲:有些人将此称为重新加载窗口)，以获得新添加的配置，以按照预期呈现。(要了解如何快速重新加载窗口，请滚动到答案的末尾)。

配置完成后，你的编辑器应该是这样的:

---

配置#2 |多个标尺

---

显然，标尺将数组作为其赋值。该数组允许VSC用户添加多个标尺。

只需向上一个示例中的配置添加一个值(如下面的代码片段所示)，我们就可以添加另一个标尺。

{
    "editor.rulers": [80, 125]
}

我拍的屏幕截图有点短，但它很好地传达了观点。您可以看到现在有两条垂直线，而不是一条直线。许多前端开发人员选择这种配置，因为125通常用作HTML的首选行长，而80是HTML文档中嵌入JavaScript的首选行长。

---

配置#3 |着色标尺

---

这个配置展示了VS Code配置的奇思妙想;标尺当然是VS Code附带的最古怪的编辑器特性之一。这个配置向您展示了如何为上面使用的配置上色。为了能够自定义标尺的颜色，需要在配置中添加一个额外的设置，看看下面:

{
    "workbench.colorCustomizations": {
        "editor-ruler.foreground": "#0099AA"
    },

    "editor.rulers": [80, 125]
}

下面你可以看到令人惊叹的太平洋蓝色!

---

为标尺上色，所以它可以在w/ Code中工作

---

所以，尽管漂亮的太平洋蓝色尺子令人敬畏，但它们并不总是实用的。不透明的——在这种情况下是高度对比的——标尺条纹是代码，这会大大降低代码的可读性。出于这个原因，开发人员通常选择在所需的线长处放置一个标尺的配置，然而，还有另一种方法。通过稍微调整前面的配置，我们可以以一种侵入性小得多的方式呈现标尺。看看下面的配置。

你看到细微的变化了吗?

{
    "workbench.colorCustomizations": {
        "editor-ruler.foreground": "#0099AA33"
    },

    "editor.rulers": [80, 125]
}

下面演示了更改的位置:

第三个配置中使用的颜色: “editor-ruler。前景”:“# 0099 aa” 第四种配置中使用的颜色: “editor-ruler。前景:# 0099 aa33”

换句话说，新配置的调整色值(颜色/色调)是透明的(或不是100%不透明度);标尺呈现为部分透明(大约25%透明度)。

这一变化具有相当显著的效果，因为不透明的标尺阻碍了可读性，并且会分散程序员对代码的注意力。程序员可能会选择透明标尺，因为透明标尺将允许她以任意长度间隔测量代码的长度，而不会妨碍代码的可读性。

看到下面的透明标尺了吗?你可以点击图片查看大图。

---

终极定制标尺

---

透明标尺的问题是，它们不像其他标尺那么花哨，幸运的是，有一种方法可以两全其美。本例使用两个图像(或屏幕截图):一个图像显示配置，就像上面看到的其他图像一样，另一个是显示我使用的配置的最终图像。我所使用的配置是为了帮助您更好地了解一个好的标尺配置能够完成什么。

下面是一种疯狂的配置……

{
    "workbench.colorCustomizations": {
        "editorRuler.foreground": "#00999922"
    },

    "editor.rulers": [
        20, 40, 40, 60, 60, 60, 60, 80, 80, 80, 80, 80, 80, 80, 80, 80, 80
    ]
}

我知道这很疯狂，对吧?

这个配置，看起来很简单，但实际上它产生了一个非常有趣的，高度定制的结果。我非常喜欢这个例子，因为它很好地演示了标尺数组属性配置是如何工作的，以及可以用它完成什么。

结果如下:

注意到发生了什么吗?

尺子一个比一个亮。标尺之所以这样做，是因为我们在彼此之间放置了几个透明的标尺。随着每层标尺的颜色变得更加饱和。这是一个非常有趣的效果。

---

就像我上面说的，我将向你展示我使用这个效果来配置我的环境:

请注意，除了最后两个标尺外，所有标尺都是透明的。这提供了一个时髦的环境，同时仍然保持实用性。使用多个标尺还有助于格式化和组织代码。我现在已经习惯了使用它们，以至于我几乎无法忍受在没有它们的环境中工作。

如果我在一个项目中使用强制限制80个字符的样式指南，我经常会将一行字符设置为80，另一行字符设置为90。我写我的代码，它打破之前，或在，80个字符，然而我不喜欢80个字符的限制，我觉得标准应该是85 - 90个字符。80真的会让开发者觉得自己被塞进了一个盒子里。因此，如果我不喜欢一条线看起来是80，我将把它扩展到90。在提交之前，我看一下文件，很快就能看到超过80的地方，我添加了换行符，提交。然后我用ctrl+z重置换行，使其超过80。

另一个目的是，当我注释时，我喜欢在70结束我的注释，这有助于我在视觉上区分注释和代码。当你有额外的行，有一个很好的机会，你会开始使用它们来做各种各样的小格式习惯。

---

---

下面的资源只适用于那些需要重新加载VS Code实例的指导的人。

在vs代码中重新加载窗口

要重新加载窗口，请按F1打开快速输入菜单。您应该看到菜单打开，键入Developer: Reload Window，然后从下拉菜单中选择Developer: Reload Window选项。

进入菜单文件->首选项->设置并添加

"editor.rulers": [preferred-value, preferred-value]

颜色可定制

workbench.colorCustomizations