今天在查看css模塊化方式的時候，發現了很多可以使css模塊化的工具。其中包括css in js 和 css modules 等。個人覺得css modules更加好用一些。其主要的語法如下:
由於目前比較流行的打包工具是webpack，所以針對webpack中的配置方法進行簡單介紹；
1.npm install css-loader,style-loader -D
在webpack.config.js中配置
{
test:/\.css$/,
loader: "style-loader!css-loader?modules",
}
2.在使用的時候也比較簡單，
@import style from 'xxx';(該處指代地址)；引入之後 可以將對應的style中的類名直接賦值給對應的元素，就會產生一個獨一無二的class類名，雖然後面調試會有可能 有一些問題，
在style中是這樣的
{
.div{
font-size:14px;
}
}
在react中可以這樣寫：
1）.<div className = {style.div}></div>
在vue中可以這樣寫：
1.）在vue中其實就沒必要使用了，因爲vue可以在<style scoped>就可以直接進行css模塊化了；
3.如此使用的話，就是全部都是模塊了，定義全局樣式的話，可以使用如下語法
在編寫css樣式的時候就可以直接進行定義了；
：global（.div）{
font-size:14px;
}
這樣定義的class類名就是全局樣式了。
4.樣式繼承
如果.div需要繼承其他類名樣式的話，可以在css樣式中這樣寫：
.div{
font-size:14px;
composes: 這裏寫所需要繼承的類名即可；
}
css模塊化還有很多種方式，css-modules只是其中一種，也是想總結一下，所以直接發佈成博客了。