ie9 css文件大小限制

使用webpack生成CSS对于一些有趣的定义很有趣。不幸的是，当你拥有一个大型应用程序并且需要IE9支持时，乐趣就会停止，因为IE9会忽略你生成的CSS包中的大于4000个选择器的部分。解决方案是将CSS巧妙地拆分为多个较小的CSS文件。

 

安装

npm install --save css-split-webpack-plugin

用法

简单的实例添加CSSSplitWebpackPlugin在您的WebPack配置文件到你的插件列表后 ExtractTextPlugin。而已！

var ExtractTextPlugin = require('extract-text-webpack-plugin');
var CSSSplitWebpackPlugin = require('../').default;

module.exports = {
  entry: './index.js',
  context: __dirname,
  output: {
    path: __dirname + '/dist',
    publicPath: '/foo',
    filename: 'bundle.js',
  },
  module: {
    loaders: [{
      test: /\.css$/,
      loader: ExtractTextPlugin.extract('style-loader', 'css-loader'),
    }],
  },
  plugins: [
    new ExtractTextPlugin('styles.css'),
    new CSSSplitWebpackPlugin({size: 4000}),
  ],
};

可以使用以下配置选项：

size：default: 4000单个文件中允许的最大CSS规则数。为了与IE一起使用，这个值应该在某处4000。