create-react-app 搭建的项目中,使用 CSS Modules

create-react-app 搭建的项目中,使用 CSS Modules:

修改config目录下 webpack.config.dev.js 和 webpack.config.prod.js 文件:

                loader: require.resolve('css-loader'),
                options: {
                  importLoaders: 1,
                  // 新增下面2行
                  modules: true,
                  localIdentName: '[name]__[local]__[hash:base64:5]'
                },

CSS Modules 与 stylus 结合:

create-react-app引入stylus说明:http://www.cnblogs.com/cag2050/p/8889151.html
分别修改config目录下 webpack.config.dev.js 和 webpack.config.prod.js 文件中,styl对应的处理部分,详见github项目。

让 CSS Modules 不作用于 node_modules 里的内容:

如果想开启css的css modules功能,就比较麻烦点;除了针对css开启css modules,还需要需要针对antd的css 单独写一条loader的规则,不开启 css modules。
参考:https://www.jianshu.com/p/51ff1c8be301
此项目中手动引入:import 'antd/dist/antd.css'

原文地址:https://www.cnblogs.com/cag2050/p/9394430.html