vscode高亮由各插件独立控制,统一配置不可行;todo tree通过todo-tree.配置项管理标签识别与高亮样式,color highlight依赖colorhighlight.设定语言与颜色匹配,volar高亮需确保语言模式为vue并启用takeovermode,editor.tokencolorcustomizations仅影响语法作用域,不作用于插件装饰。

VSCode 本身不提供“高亮插件配置文件”的统一入口,所有高亮行为都由具体插件(如 Todo Tree、Color Highlight、Volar)各自控制,且几乎全部通过 settings.json 驱动。想靠一个文件管住所有高亮?做不到——但你可以用 settings.json 精准调度每个插件的行为。
Todo Tree 的高亮和扫描逻辑全靠 todo-tree 配置项
它不是靠正则硬匹配,而是解析注释语法结构,所以默认就能识别 // TODO、/* FIXME */、# NOTE 等跨语言写法。关键配置都在 settings.json 里:
-
todo-tree.general.tags:定义识别哪些标记,默认是["TODO", "FIXME", "BUG", "HACK"];加"REVIEW"就能捕获// REVIEW: 需要对齐接口 -
todo-tree.highlights.customHighlight:必须写成对象,比如{"FIXME": {"foreground": "#ff3b30", "fontStyle": "bold"}};写成数组会失效 -
todo-tree.filtering.includeGlobs:限制扫描范围,例如["**/*.ts", "**/*.vue"],避免在node_modules里瞎扫拖慢响应 - 它默认只扫描注释区域;若要在
README.md或package.json里也识别,得开todo-tree.general.scanWholeFile,但性能代价明显
Color Highlight 的颜色块渲染依赖 colorHighlight 配置组
它不改语法高亮,只在颜色值旁加小色块,但这个“加”是否生效,取决于你有没有告诉它在哪种语言里干活:
使用ydata-profiling(前身为pandas-profiling)生成全面的数据质量报告,包含相关性分析、缺失值模式和基数检测。导出交互式HTML仪表板和JSON摘要。
-
colorHighlight.languages:必须显式列出支持的语言 ID,比如["css", "scss", "html", "vue", "javascript"];缺了vue,<style scoped></style>里的#42b883就不显示色块 -
colorHighlight.showColorsInComment:设为true才能让// background: #ff6b6b这类注释里的颜色也被渲染 -
colorHighlight.colors:支持自定义正则匹配,比如{"pattern": "var\(--primary\)", "color": "var(--primary)"},但注意双反斜杠转义 - 如果色块突然消失,先关掉其他装饰类插件(如 Bracket Pair Colorizer),它们会劫持 editor decorations 渲染通道
Volar 的高亮不是“插件级开关”,而是语言服务接管状态
Vue 文件没高亮,90% 是因为 Volar 没真正接管,而不是某个配置没开。它不走 highlight 类配置项,而是靠整个语言服务链路:
- 右下角语言模式必须显示纯
Vue,不是Vue (Vetur)或HTML;否则<template></template>当 HTML 解析,defineProps直接报红 -
volar.takeOverMode必须启用,且状态栏显示Volar (Take Over);否则ref不自动解包,props.xxx无类型提示 - 禁用 VSCode 内置的
TypeScript and JavaScript Language Features插件,否则它和 Volar 抢 TS 服务,导致高亮错乱或延迟 -
files.associations里加"*.vue": "vue"是基础,但不能替代手动切换语言模式——VSCode 不会自动应用这个关联到已打开的文件
别指望 editor.tokenColorCustomizations 能覆盖所有高亮
这个配置只影响语法作用域(keyword、string、comment 等),对插件生成的装饰(如 Todo Tree 的行高亮、Color Highlight 的色块)完全无效:
- 它需要配合开发者工具里的
Inspect Editor Tokens使用,光猜scope名字大概率配错 - 修改
editor.lineHighlightBackground要走workbench.colorCustomizations,不是tokenColorCustomizations - 某些主题(如 Default Dark+)把
editor.lineHighlightBackground设得极淡,改settings.json也不顶用,得换主题或手动覆盖 colorCustomizations - 插件高亮和 token 高亮是两套机制:前者靠 Decoration API 注入 DOM 元素,后者靠 TextMate 语法规则着色;混在一起调,只会互相遮盖










