15

Grunt を使用して、プロジェクトとcssminタスクを内部でビルドします。CSS ファイルにリモートの @import ステートメントが含まれておりgrunt build、警告が返されます。

Running "cssmin:generated" (cssmin) task
>> Ignoring remote @import of "http://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic" as no callback given.,Ignoring remote @import of "http://fonts.googleapis.com/css?family=Maven+Pro:500" as no callback given.
>> 2 files created. 322.48 kB → 249.05 kB

clean-cssライブラリのドキュメントで次の情報を見つけました。

リモート @import ステートメントをインライン化するには、minify メソッドへのコールバックを提供する必要があります。

var CleanCSS = require('clean-css');
var source = '@import url(http://path/to/remote/styles);';
new CleanCSS().minify(source, function (errors, minified) {
  // minified.styles
});

これは、ローカル ファイルは同期的に読み取ることができますが、リモート リソースは非同期的にしか処理できないという事実によるものです。コールバックを提供しない場合、リモートの @import はそのまま残ります。

リモート @import ステートメントの処理を修正するために、Gruntfile.js で cssmin タスクを記述するにはどうすればよいですか?

4

2 に答える 2

4

これは最善の解決策ではありませんが、すべての @import ステートメントを別のファイルに移動し、メインの css ファイルの直前に html ファイルに挿入するとうまくいきました。

于 2016-04-26T01:16:07.047 に答える