1920*1080分辨率的用户,安装好vscode的第一件事情
将字体大小调整为15,可能是微软那一帮子工程师人手一个suface吧,那货就没有分辨率<=1k的
默认字体大小为14屏幕显示起来会显得模糊
下面展示我的浅色主题和深色主题
深色
浅色
其实没什么万能的方法可言
好不好看都是根据个人审美而定
想拥有一个让自己满意的主题只能自己修改
先找到一个大体符合自己心意的主题
我的两个修改好的主题基础部分是Github和Monokai
修改配色必须修改json文件
从插件商店下载的主题插件的存放路径是
C:\Users\%username%\.vscode\extensions
下对应的文件夹
默认插件的安装路径是
C:\Users\%username%\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions
路径下对应的文件夹
为了使得主题不被vscode或者插件更新而回复原样,我们需要创建自己的主题插件
在C:\Users\%username%\.vscode\extensions路径下创建一个文件命名为合理的名字
创建一个能让vscode识别到的插件需要有一个package.json
为了能让你的vscode的插件管理能识别到你自定义的插件,需要有一个package.nls.json文件
以及一个用来存放配色的文件夹themes
首先编写package.json
{ "name": "theme-tangming", "displayName": "%displayName%", "description": "%description%", "version": "1.0.0", "publisher": "tangming", "engines": { "vscode": "*" }, "contributes": { "themes": [ { "label": "Tangming Dark", "uiTheme": "vs-dark", "path": "./themes/tangming-dark.json" }, { "label": "Tangming Light", "uiTheme": "vs", "path": "./themes/tangming-light.json" } ] } }
其中,你需要修改的部分或者不修改但必须有的部分
name(插件的名字)
displayName(插件在vscode中显示的名字)
publisher(插件作者)
themes下的 label (主题显示的名字)
必须保持正确的东西
themes选项中的uiTheme(深色或是浅色主题,只有vs和vs-dark两种选择分别对应浅色和深色)
themes选项中的path(主题json文件的路径,一般用相对路径,可以之后再纠正)
剩余选项的影响几乎可以忽视
同时,themes是一个主题列表,列表的每项对应一个主题,我的配置文件中就有两个主题,一个浅色一个深色
现在可以在之前心仪的主题的基础上进行修改
先将基础主题的json文件找到复制进我们刚刚创建的themes文件夹
顺便改一个名字,当然也可以不改
然后将package.json中themes中对应主题的path路径订正为对应的themes文件夹下对应文件的路径名
然后用vscode打开文件
会看到密密麻麻的列表文件
前半截是描述的页面的配色
后半截是描述的代码配色
页面相应的部分鼠标移动到那里会显示注解,出现英文的注释的话你需要安装一个chinese插件
首先确定主题为深色还是浅色主题然后在package.json的uiTheme处填vs(浅色)或者vs-dark(深色)
在package.json内选择的uiTheme填入的vs 和 vs-dark会给全部可定制部分带来一个默认颜色
也就是说我们这里的修改,类似于是在默认的基础上覆盖
同时也会有一个问题
可能有的属性原作者未曾修改,然后代码里没有出现,比如Monokai这个主题里面就没有活动标签页
修改 "titleBar.activeBackground" 属性
定制页面的大体流程就是这样
然后是定制代码样式
一般通过定制的基本属性有颜色,加粗,倾斜,下划线
类似于上图
name是起给自己看的名字
scope是settings作用的范围
settings是要自定义的内容
fontstyle控制加粗(bold)倾斜(italic)下划线(underline),可以多选
fontground是字体颜色
类似于
可以追加
比如
{ "name": "A", "scope": "support.type, support.class", "settings": { "fontStyle": "italic", } }, { "name": "B", "scope": "support.type, support.class", "settings": { "fontStyle": "bold", } }
一切修改好后重启vscode,点击首选项和主题
如果出现了自定义的主题,那么就表示能使用这个主题了
然后点击插件,如果能看到我们刚刚定制的插件的话,就表示大功告成了
原文：https://www.cnblogs.com/TAMING/p/9766377.html