最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
如何用CSS-报错排查和位置线索
时间：2026-08-26 20:50:49 编辑：袖梨 来源：一聚教程网
判断如何用是否好用，关键不在功能堆得多，而在Block 名怎么定才不和 Ant Design、Element Plus 撞车、Element 命名为什么不能写成 card__content__title、Modifier 怎么加才不会变成“状态污染”能不能解决真实需求。先看使用边界，再看具体做法。
先看原文给出的关键信息：公共组件库 class 名必须带业务/团队前缀、禁用泛化词，并经工具链三阶拦截；Block 名是可交付 UI 单元的唯一 ID，须用如 nc-button 格式，禁用 base-button 等泛化命名。；公共组件库的 class 名不是“起得像 BEM”就行，而是必须带业务/团队前缀、禁用泛化词、通过工具链三阶拦截——否则三个月后就会出现 btn--primary 和 button-prima。继续往下处理时，重点放在这些条件上：Block 名怎么定才不和 Ant Design、Element Plus 撞车 直接叫 button 或 card 是高危操作，第三方库和内部旧代码都会覆盖它。；Block 名本质是「可交付 UI 单元」的唯一 ID，不是语义描述。；出现双下划线嵌套，说明你把 wrapper div 当成了语义节点，而它很可能只是个无意义的容器。。收尾检查时，再把这些细节对上：正确：card__title、card__body、card__footer——全是 card 的直接子元素 ❌ 错误：card__content__title——co；或真有复用场景，才把 content 提高为独立 block（如 card-content） Modifier 怎么加才不会变成“状态污染” Modifier 描述的是；加错位置会导致样式无法收敛、调试时 DevTools 里类名和源码对不上。。