font: Dank-Mono-Font
settings: Stackoverflow
// settings.json
{
"editor.fontFamily": "'Dank Mono' , 'JetBrainsMono NF', Menlo, Monaco, 'Courier New', monospace",
//让 Visual Studio Code 显示斜体字体 https://stackoverflow.com/questions/41320848/how-do-i-get-visual-studio-code-to-display-italic-fonts-in-formatted-code
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": [
// the following elements will be in italic
// (=Fira Code iScript)
"comment",
"keyword.control.import.js", // import
"keyword.control.export.js", // export
"keyword.control.from.js", // from
"keyword.control.import.ts", // import
"keyword.control.export.ts", // export
"keyword.control.from.ts", // from
// "constant", // String, Number, Boolean…, this, super
"storage.modifier", // static keyword
"storage.type.class", // class keyword
"storage.type.php", // typehints in methods keyword
"keyword.other.new.php", // new
"entity.other.attribute-name", // html attributes
"fenced_code.block.language.markdown" // markdown language modifier
],
"settings": {
"fontStyle": "italic"
}
},
{
"scope": [
// the following elements will be displayed in bold
"entity.name.type.class" // class names+
],
"settings": {
"fontStyle": "bold"
}
},
{
"scope": [
// the following elements will be displayed in bold and italic
"entity.name.section.markdown" // markdown headlines
],
"settings": {
"fontStyle": "italic bold"
}
},
{
"scope": [
// the following elements will be excluded from italics
// (VSCode has some defaults for italics)
"invalid",
"keyword.operator",
"constant.numeric.css",
"keyword.other.unit.px.css",
"constant.numeric.decimal.js",
"constant.numeric.json",
"comment.block",
"entity.other.attribute-name.class.css"
],
"settings": {
"fontStyle": ""
}
}
]
},
}
使用 scope inspect 工具进行微调
使用 Ctrl+Shift+P
进入 vscode 的命令窗口,输入 Developer:Inspect Editor Tokens and Scopes
进入开发者模式,检查编辑器和标记作用域模式,这时候你会发现点击你调试窗口中你想修改的部分,会出现相关的 scope 信息