修改 vscode 左侧导航栏的文字大小 （更新版）

新增, 个人常用

• 按 Ctrl + Shift + P 打开命令面板

• 输入并选择 :

• Developer: Toggle Developer Tools

• 打开开发者工具。

1. 起因， 目的:

• 问题： vscode 左侧的文字太小了！！！
• 我最火的一篇文章，写的就是这个问题。 看来这个问题，是很广泛的一个痛点。
• 我最近更新了 vscode， 这个问题又出现了。再来搞一下。
• 编程工具很关键的。个人的工具，美观，实用，提升效率， 防止火爆脾气。

2. 先看效果

此时能实现，左侧和右边的文字一样大。

3. 过程:

• 详细聊天过程，修改步骤， 在这里。

3.1 vscode 修改左侧导航栏的文字大小

个性化设置

1. 安装 "Custom CSS and JS" 扩展（如果尚未安装）。

2. ctrl + shift + p，运行:

   Enable Custom CSS and JS

   启用自定义样式, 这一步，很关键！后面修改之后 css 之后，也是再来一遍。

3. ctrl + shift + p, 输入 settings.json

4. 找到自定义的 css 文件， 没有的话，就新建一个

     "vscode_custom_css.imports": [
       "file:///C:/Users/Administrator/custom-vscode.css"
     ],

5. 这个 css 写上：

   /* 调整左侧导航栏（Explorer）的字体大小 */
   
   /* 原来的写法 */
   /* 聊天记录: https://x.com/i/grok?conversation=1928671798994022793   */
   
   /* vscode 更新之后，新的的写法 */
   
   /* 调整左侧导航栏（资源管理器）中文件和文件夹名称的字体大小 */
   .monaco-workbench .part.sidebar .monaco-list .monaco-list-row .monaco-highlighted-label {
       font-size: 21px !important;
   }

6. 最后，还是这个， ctrl + shift + p，运行:

   Enable Custom CSS and JS

   启用自定义样式, 这一步，很关键！后面修改之后 css 之后，也是再来一遍。

7. 成功之后， 会出现一个警告。 请点击： 下次不要再弹出来了。

4. 结论 + todo

• 如果无法实现，请从头到尾再试一遍。
• 过程虽然有点麻烦，但是是值得的。

---

希望对大家有帮助。