解决的方向: 生成唯一的类名; shadow dom; 内联样式; Vue-scoped 方案
2️⃣ 依赖
由于 CSS 的’全局性’, 所以就产生了依赖问题:
一方面我们需要在组件渲染前就需要先将...因为原生 CSS 一般有开发者由配置类名(在 html 或 js 动态指定), 所以工具很难对类名进行控制.
压缩类名也会降低代码的可读性, 变得难以调试....学习对 CSS 相关技术进行选型决策
社区上最流行的, 也是笔者觉得使用起来最舒服的是styled-components, styled-components 有下列特性:
自动生成类名, 解决 CSS...通过组件名来标志样式, 自动生成唯一的类名, 开发者不需要为元素定义类名.
绑定组件....特性:
比较轻量, 不需要 JS 运行时, 因为他在编译阶段进行计算
所有样式默认都是 local, 通过导入模块方式可以导入这些生成的类名
可以和 CSS proprocessor 配合
采用非标准的语法