usemin、rev、less、源映射和 IE8 选择器计数支持答案

【问题标题】：usemin, rev, less, source maps and IE8 selector count supportusemin、rev、less、源映射和 IE8 选择器计数支持
【发布时间】：2015-01-29 14:21:44
【问题描述】：

这是一个令人担忧的问题，在保持要求的同时很难解决。

通过 grunt 任务使用 usemin 来优化复杂且相当大的应用程序的构建。现在的问题是 IE8 和 IE9 正在从一个正在构建的单个文件中删除 CSS 规则声明，这是由于不明确的 4095 最大规则限制。

目前，它是这样工作的：

less 在 dist 中构建一个大文件main-min.css
源图已添加main-min.css.map
使用 rev 到 main-min.<hash>.css, main-min.<hash>.css.map 的进程

未来，它需要：

less 在 dist 中构建一个大文件main-min.css
https://github.com/project-collins/grunt-csssplit 之类的东西会转换为main-min-part1.css 和main-min-part2.css（等等）。当前不返回新文件的名称，不支持源映射 - 但这很容易修补和添加或从 FS 读取
usemin 用于获取新的拆分样式，例如，从 assetDir 并单独包含所有（未连接），这在尝试专门创建单个文件的示例/工作流程中似乎缺乏。
零件现已修订
源地图？（可以丢掉这个）

此类设置的任何想法/示例都值得赞赏。或替代方法。

【问题讨论】：

我也遇到同样的问题，正在寻找使用 csssplit 和 usemin 的解决方案

标签： css internet-explorer-8 grunt-usemin grunt-contrib-cssmin

【解决方案1】：

如果我正确理解您的要求，这是解决您问题的简要思路：

Steps:
    1. Defined a pattern in your index.html. For instance:
        <!--USE_MIN_BLOCKS-->
        <!--END_BLOCK-->
    2. Make a new replace task to replace above block with new usemin blocks dynamically (based on generated files of grunt-csssplit). 
    For instance:

    replace: {
    usemin: [{
        match: /<!--CSS_USEMIN_BLOCKS-->[\S\s]+<!--END_BLOCK-->/i, replacement: function() {
            //put your link tag here
            linkTag += '    <!-- build:css css/' + cssFile + ' -->\n';
            linkTag += '    <link rel="stylesheet" href="css/' + cssFile + '">\n';
            linkTag += '    <!-- endbuild -->\n';
        }
    }]
    }
    3. Run the replace:usemin task before usemin task.

【讨论】：