自定义Visual Studio Code样式终极解决方案

vscode 编辑器本身的主题可以改,但是条目太多,我要说的不是这个。vscode基于浏览器技术栈,所以可以注入自定义的css。

原理是修改了vscode/electron的主界面文件,workbench.html,内联了注入的样式以及js。无法实时更新,每次修改后需要重启vscode(可以用该扩展的指令只刷新界面,不用完全重启)。可配合vscode自带控制台(在帮助菜单里)的元素拾取功能进行修改。

下载地址:https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css
自定义Visual Studio Code样式终极解决方案_第1张图片
修改了背景色,不刺眼。修改字体颜色,纯黑,而不是原来的泛灰效果,原来的有点让人看不清。给标签栏的活动项目加上了橘黄色的indicator,去掉非活动标签的灰色背景,一眼就能看清。

还能注入Javascript,可以调整元素顺序,比如让标签栏或者代码导航栏置底,若能和插件一样调用vscode.command就完美了,那样就可以打造自己的工具栏,可惜目前还做不到。

你可能感兴趣的:(编译奇兵,vscode,编辑器,css)