sublime text无法直接解析css语法树，需用转义后选择器配合非贪婪匹配定位单层样式块，因.*?不跨行、{ } 可能出现在字符串中且元字符须转义。
Sublime Text 本身不支持直接解析 CSS 语法树，但用正则提取内联 <style></style> 中特定选择器的样式块是可行的——前提是严格控制边界、转义元字符、并避开嵌套干扰。
为什么直接搜 #id p{.*?} 总是错
因为 .*? 在 Sublime 中默认不跨行，且遇到换行或注释就会中断；更关键的是，{ 和 } 在 CSS 里可能出现在字符串、注释或值中（比如 content: "{hello}";），盲目匹配会越界。另外，#、.、[ 这些字符在正则里有特殊含义，不转义就根本不会按字面匹配选择器。
- 必须对输入的选择器做转义：把
#header .btn[data-type="primary"]转成\#header\ \.btn\[data\-type\=\"primary\"\] - 不能依赖
.*?匹配样式体——它无法识别{和}的层级，一遇到多行或嵌套就失效 - Sublime 不支持
(?R)递归，也不支持平衡组，所以别想靠单条正则处理带嵌套大括号的值
安全提取单层样式块的正则写法
目标是精准捕获某个选择器后第一个 { 到其对应闭合 } 之间的内容（不跨其他规则，不进字符串）。
- 查找模式：
(? —— 使用正向先行断言 <code>(? 锁定选择器+空白+<code>{，再用[^}]*?非贪婪吃掉所有非}字符，最后用(?=})确保后面紧接} - 必须手动开启
.*模式（Alt+R），否则?、{全当字面量 - 若样式体含换行，需勾选
. matches newline（替换面板里那个...图标），否则[^}]*?会在第一行末就停住 - 不推荐用
\s*替代空白：CSS 中制表符、全角空格、零宽空格都可能出现，\s在 Sublime 里会吞掉换行符，导致格式错乱
跨文件提取时最常踩的三个坑
全局搜索（Ctrl+Shift+F）看起来方便，但实际极易误伤：
-
Where路径没限定：填*或留空 →node_modules、dist全被扫，$1引用可能指向完全无关的文件 - 替换框里用了
$1，但查找框没写捕获组：比如只写了#app {，没加()，那$1就是空的，结果替成字面量$1 - 没点
Find All预览就直接Replace All：Sublime 不提供二次确认，改错只能靠 Git 恢复
真正该放弃正则的场景
当遇到以下情况时，正则已不是“不够好”，而是“不可靠”：
- CSS 值里含
url(data:image/svg+xml;base64,...)—— 里面可能有未转义的} - 选择器含伪类或函数，如
:is(.a, .b) .c或div:nth-child(2n+1)，括号和运算符会让转义逻辑爆炸 - 样式块被注释包裹，如
/* #x { color:red; } */—— 正则无法区分注释内外 - HTML 字符串里混着 JS 模板字面量，如
<style>${css}</style>—— 正则根本分不清哪段是真实 CSS
这些时候，与其花两小时调正则，不如用浏览器 DevTools 复制计算后样式，或引入 postcss 解析器做真实语法分析。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
