如何在GitHub上更改标签大小？

当我在GitHub上查看文件时，选项卡显示为8个空格。

例：

是否可以将此配置更改为2或4个空格？

更新资料

是的。如mortenpi所述，这可以通过附加的查询参数来完成。请参阅他的答案以获取更多详细信息。

原始答案

是否可以将此配置更改为2或4个空格？

不可以。它仅可通过Ace编辑器作为编辑功能的一部分使用，并且更改不会持久保存。

这篇博客文章提供了有关嵌入式IDE的更多信息。

但是，只要您知道愿意查看的Blob（文件）的网址，就可以通过使用编辑段更改Blob段并使用下拉菜单选择所需的标签大小来轻松地切换到编辑模式。

• 标准视图：https : //github.com/moroshko/mmSelect/blob/master/mm_select.js
• Ace视图：https : //github.com/moroshko/mmSelect/edit/master/mm_select.js

您可以在URL上追加?ts=2或?ts=4来更改标签大小。

示例：https：//github.com/jquery/jquery/blob/master/src/core.js？ts = 2

该值似乎可以是1到12之间的任何值。尽管如此，它不适用于Gist或原始文件视图。

来源：GitHub备忘单

设置存储库的默认显示选项卡大小

当您的存储库中有一个.editorconfig时，在GitHub上查看代码时将尊重它。

indent_style = tab和indent_size = 4显示具有4列而不是8列的标签 https://github.com/isaacs/github/issues/170#issuecomment-150489692

适用于JetBrains产品的多个扩展的示例.editorconfig：

root = true

[*]
end_of_line = lf
insert_final_newline = true

# Matches multiple files with brace expansion notation
[*.{js,jsx,html,sass}]
charset = utf-8
indent_style = tab
indent_size = 4
trim_trailing_whitespace = true

[*.md]
trim_trailing_whitespace = false

更改您如何查看其他存储库上的选项卡

在浏览器中安装Stylus，而不是在GitHub上安装GitHub：代码中尺寸更大的选项卡。

还有Google Chrome扩展程序：

• https://chrome.google.com/webstore/detail/github-tab-sizer/djpnapkcpjomnkfekaedkigfomiedpjf
• https://chrome.google.com/webstore/detail/github-tab-size/ofjbgncegkdemndciafljngjbdpfmbkn/related

实际上，可以通过浏览器扩展来做到这一点。安装时尚的（在Firefox或Chrome中），然后安装以下用户样式：“ GitHub：代码中尺寸更大的标签 ”。

它可能不适用于某些语言。例如，我正在查看一个JavaScript文件，但是没有发现任何更改。因此，我删除了作者的样式，并在其中添加了以下几行：

.tab-size {
  -webkit-tab-size: 4 !important;
     -moz-tab-size: 4 !important;
       -o-tab-size: 4 !important;
          tab-size: 4 !important;
}

它可以在Chrome上运行（屏幕截图）。

从屏幕截图中可以看到，我还启用了宽屏模式，并将配色方案更改为Solarized。因此，我通过Chrome的时尚扩展程序在GitHub页面上运行了三种用户样式。我希望这可以帮助别人。

如果您喜欢UserScript，这对我来说是成功的：

// ==UserScript==
// @name         GitHub Tabs
// @namespace    http://foldoc.org/
// @version      1
// @description  Set sensible tabs on GitHub
// @author       Denis Howe
// @match        https://github.com/*
// ==/UserScript==

document.querySelectorAll('table').forEach(t => { t.dataset.tabSize = 2 });

我这样做是为了修复它们 http://valjok.blogspot.com/2014/07/indentation-correction-for-exposed.html。

另一种选择是在嵌入要点时，用所需的空格数替换所有选项卡

<div id="willReplaceTabs">
 <script src="https://gist.github.com/valtih1978/99d8b320e59fcde634ad/cf1b512b79ca4182f619ed939755826c7f403c6f.js"></script>

 <script language="javascript">
  var spaces = "  "
  willReplaceTabs.innerHTML = willReplaceTabs.innerHTML.replace(/\t/g, spaces)
 </script>
</div>

如果这是您正在处理的项目的选项，则更改编辑器以将制表符视为空格将解决此问题。

因此，例如，在Visual Studio Code中，配置如下所示：

{
    "editor.tabSize": 2,
    "editor.insertSpaces": true
}

在Sublime中，它是：

{
    "tab_size": 2,
    "translate_tabs_to_spaces": true
}

直到最近，我仍坚持使用非间隔制表符。切换后，它修复了Github渲染怪异的现象，而且我还没有注意到工作流程中的任何重大缺点。

最好的解决方案是，如果可能的话，使维护人员相信您正在寻找的源代码，以正确数量的空格替换所有选项卡。

考虑到您经常在Web上看到标签，如今在代码中使用标签是有问题的，“每个标签多少个空格”的决定取决于它的显示位置。