1

これは懸念事項であり、要件を維持しながら解決するのは困難です。

useminvia grunt タスクを使用して、複雑でかなり大規模なアプリケーションのビルドを最適化します。現在の問題は、あいまいな 4095 の最大ルール制限のために、ビルド中の単一ファイルから IE8 と IE9 が CSS ルール宣言を削除していることです。

現在、次のように機能します。

  • main-min.cssless はdist に1 つの大きなファイルをビルドします
  • ソースマップ追加main-min.css.map
  • 回転先のusemin プロセスmain-min.<hash>.css、main-min.<hash>.css.map

今後は、次のものが必要です。

  • main-min.cssless はdist に1 つの大きなファイルをビルドします
  • https://github.com/project-collins/grunt-csssplitのようなものはmain-min-part1.cssand main-min-part2.css(など) に変換されます。現在、新しいファイルの名前は返されず、ソース マップもサポートされていません。
  • usemin を使用して、新しい分割スタイルを取得しassetDir、すべてを個別に (連結せずに) インクルードします。これは、単一のファイルを排他的に作成しようとする例/ワークフローに欠けているようです。
  • 部品が改訂されました
  • ソースマップ? （これは紛失しても構いません）

そのような設定のアイデア/例をいただければ幸いです。または代替アプローチ。

4

1 に答える 1

0

あなたの要件を正しく理解している場合、これはあなたの問題を解決するための簡単なアイデアです:

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.
于 2015-03-04T09:20:58.677 に答える