模块化
方便控制局部和全局的样式，使用css-loader实现。
写的项目是个脚手架，这边是为了兼容，公司里很多前端项目都已经集成了这个脚手架，所以要适用styles.xxx这样的写法也要能直接className="xxx"。重点在modules: 'global'，默认全局，想用局部的地方自己加:local。
还可以用babel-plugin-react-css-modules进一步简化写法，但是这边不是新的项目就没有用。
{
test: /\.less$/,
use: ['css-hot-loader', 'style-loader', {
loader: 'css-loader',
options: {
importLoaders: 2,
localIdentName: '[name]--[local]--[hash:base64:5]',
sourceMap: true,
modules: 'global' //重点
}
}, {
loader: 'postcss-loader',
options: {
config: {
path: path.join(__dirname, './postcss.config.js')
}
}
}, {
loader: 'less-loader',
options: {
sourceMap: true
}
}]
}
前面的尝试里，碰到过使用modules:true的时候，和antd有冲突，把antd的也去解析成hash了，引入的时候就找不到了，解决方式是配两份less的test，一份exclude掉node_modules，一份include node_modules，include的modules:false就行。现在改成了global就不会有这种问题，默认都是全局了。
抽离css
采取的方式是在dev下使用style-loader，在prod下使用mini-css-extract-plugin分离css成一个单独的文件在html中引入。环境变量定义好，把开发和生产的webpack.config配置分离开，便于做这种不同环境的配置。
代码参考上面的，要注意loader里的执行顺序，从右到左，从下到上。
遗留问题
本来是使用happypack来解析loader的，为了提速。但是目前项目中mini-css-extract-plugin+happypack+css-modules就会报错，所以就暂时去掉了对less的happypack loader。
概念和文档能找到的东西就不写了 自行查找~
