ctrl+shift+h（macos为cmd+shift+h）是vscode全局替换最可靠快捷键，但必须手动启用正则（点.图标）、限定文件范围（如/.css）、关闭match case和whole word以防误替，否则会错误匹配cardinal、btn-primary等非目标内容。
直接说结论：用 Ctrl+Shift+H（macOS 是 Cmd+Shift+H）做全局替换最可靠，但必须手动开正则、限定文件范围、勾选 Match Case 和 Whole Word，否则大概率改错或漏改。
为什么不能直接 Ctrl+Shift+H 就开干
VSCode 默认的全局替换是纯文本匹配，不区分上下文。比如搜 card，它会命中：class="card"、.card { }、cardinal、my-card-wrapper，甚至注释里的 // deprecated card layout。这不是“功能不行”，而是没告诉它你到底想改什么。
- 必须点搜索框右侧的
.*图标启用正则模式，否则\b、$1全部失效 -
Match Case不开 → 把Card、CARD也一起替了，破坏 CSS 选择器大小写敏感性 -
Whole Word不开 →btn-primary里的primary被单独拎出来替，类名结构崩坏 - 不填
files to include→ 默认跳过node_modules，但若项目里有src/styles/card.css和src/components/Card.tsx，不加**/*.css,**/*.tsx就只改一半
安全批量改类名的正则写法
目标是只改 HTML 中的 class 属性值和 CSS 文件里的选择器，不碰 JS 字符串、注释、其他单词。推荐两个最小侵入式正则：
- 查 HTML 类名：
class=["']([^"']*?)\b(old-class)\b([^"']*?)["']，替为class="$1new-class$3"（保留前后其他类） - 查 CSS 选择器：
([.][^{]*?)\bold-class\b，替为$1new-class（注意开头的.被捕获，避免误改old-class-text） - 关键点：
\b确保是完整单词边界；[^"']*?非贪婪匹配引号内内容；$1必须写对，写成${1}或or $1会静默失败 - 跨行？CSS 里类名不会换行，HTML 模板若用 JSX/TSX 且属性换行，得用
[sS]*?替代.*?，但优先检查是否真有必要——多数情况不用
替换前必须验证的三处细节
VSCode 的 Replace in Files（双文档图标）是真正写磁盘的操作，但一旦点下去就无法一键撤回跨文件改动。务必确认：
- 左侧结果树里只有你预期的文件：点开每个匹配项左侧的
▶，看上下文是不是class="old-class"或.old-class {，不是data-old-class或/* old-class hack */ -
files to include填的是**/*.html,**/*.css,**/*.tsx，而不是*.css（后者只搜根目录）或src/**（可能误扫到dist/） - 右下角状态栏显示
Regex标签，且.*图标是蓝色高亮——很多人输完\b搜不到，其实是图标没点亮，所有元字符当普通字符处理
比全局替换更稳的替代方案
如果类名修改涉及语义变更（比如从 btn-primary 改成 cta-button），或项目已用 Tailwind、Emotion 等工具链，单纯文本替换容易漏掉动态拼接场景：className={`${base} ${isPrimary ? 'btn-primary' : 'btn-secondary'}`。这时：
- F2 重命名在支持的语言服务下更安全，但前提是 TS/JS 项目有
tsconfig.json且状态栏不显示Plain Text - 多光标仍是小范围救急首选：
Ctrl+D逐个加选当前文件中所有btn-primary，再统一输新名；Ctrl+Shift+L一次性选中全部，适合单文件 CSS - 真正难的不是换名字，而是换完后浏览器里有没有样式丢失——CSS 优先级、层叠顺序、BEM 命名嵌套层级，这些 VSCode 替换不了，必须人工点开 DevTools 看 computed styles
