VS Code自定义侧栏

Tri*_*ara 18 visual-studio-code

有没有办法在VS Code中自定义侧栏?特别是,我想改变字体大小.是否有用户设置?或者,也许,我可以通过样式表以某种方式编辑它,因为它是一个电子应用程序,就像Atom一样?

Dan*_*mms 24

vscode没有用户定义的样式表.

目前缩放UI各个部分的唯一方法是通过整体缩放级别(window.zoomLevel)和编辑器的字体大小(editor.fontSize).

repo上为此创建了一个功能请求.


小智 7

我发现使用常规缩放设置非常有效(它位于巨大的设置窗口中的某个位置)。这将调整整个应用程序的缩放级别。调整它直到您喜欢资源管理器窗口的大小,然后调整可设置的编辑器字体以便在该缩放级别下可读。我在一台良好的 17 英寸笔记本电脑显示器上设置了 3 个 80 列的并行代码窗口以及资源管理器,如果您可以使用 8pt 代码字体(实际上是缩小了两个档次的 11 点字体),那么就可以阅读。


小智 5

我找到了更改 Visual Studio Code 窗口字体的方法。

\n\n
    \n
  1. 首先,打开命令 Pallete,然后输入“Toggle Developer Tools”
  2. \n
  3. 这将打开“Chrome 检查器”。
  4. \n
  5. 选择应用程序侧边栏的任何文本。
  6. \n
  7. .monaco-shell在右侧检查器的“样式”选项卡中搜索类(其中显示当前文档的每种样式),然后是font-family属性。这是选项卡和样式表。
  8. \n
  9. 右键workbrench.main.css单击并单击“打开源面板”显示如下
  10. \n
  11. 使用此图标格式化 css 代码。
  12. \n
  13. ctrl+f再次查找font-family属性,导致格式重定向到 css 文档末尾,并在 ~6371 行中获取类似这样的.monaco-shell类。
  14. \n
  15. 更改此字体(我已更改为 Droid sans Mono 字体),但您可以更改为您想要的。
  16. \n
\n\n

为什么我不改变真实文档的 css

\n\n
    \n
  1. 因为,当我更改真实文档 css 中的字体系列时( C:\\Users\\${user}\\AppData\\Local\\Programs\\Microsoft VS Code\\resources\\app\\out \\vs\\workbench\\workbrench.main.css) 生成错误消息“Vscode 有错误,请重新安装程序”或类似内容

  2. \n
  3. 当生成应用程序的实现时,声明的字体系列将被删除,并且文件css是\xc2\xb4t一个漂亮的代码。

  4. \n
\n\n

此过程更改 Visual Studio Code 应用程序的每种字体(不包括编辑器字体)

\n


rud*_*dra 5

虽然没有像settings@Daniel Imms 在他的回答中提到的那样直接自定义侧边栏的方法,但我发现了 2 个插件可以帮助解决这个问题。如果您愿意,您可以选择其中之一。

1.自定义CSS和JS加载器

Custom CSS and JS Loader插件中,您需要创建一个自定义 css,然后该插件将直接注入该代码electron-browser/index.html(因为 VS Code 是一个基于电子的编辑器)。我在 Mac 上使用这个 CSS:

".explorer-viewlet .mac": "font-size: 1.2em !important",
Run Code Online (Sandbox Code Playgroud)

2. 自定义UI

CustomizeUI依赖于Monkey Patch Extension在 VSCode 中注入自定义 javascript。settings.json以下是我在 Mac 上使用的设置(在 中):

"customizeUI.stylesheet": {
    ".explorer-viewlet .mac": "font-size: 1.2em !important; overflow: auto; border-left:none!important",
},
Run Code Online (Sandbox Code Playgroud)