CSS Modules

CSS Modules ,官方解释如下:

CSS files in which all class names and animation names are scoped locally by default.

翻译结果:

CSS 的类名和动画名字都在一个命名空间下。

例子:

// test.css
.box{
    color:red;
}
import style from 'test.css'

function Test(){
    return (<div class={style.box} />)
}

伪输出:

<div class="_styles__box_34682763478"></div>

总的来说,CSS Modules 做了一件时,混淆了 class 类名、id 和动画名

CSS Modules 原理上仍是传统的 CSS 编写方式,只不过它混淆了名称,并添加了映射

 

posted @ 2019-07-08 13:50  _心之所向便是光  阅读(135)  评论(0编辑  收藏  举报