12

私がしたいこと:データベースからCSSプロパティを取得し、それをlessファイルにダンプします。次に、less / yui compress-filterを適用し、出力をtwigテンプレートにダンプします。


すぐに要点を説明しましょう。

テンプレートエンジンとしてSilexとTwigを使用するPHPWebアプリケーションがあります。css / jsファイルを処理して縮小するために、AsseticとSilex-Twig/Assetic-Extensionsを使用しようとしています。

silex拡張機能を登録し、使用するフィルターを設定しました。今では、小枝テンプレート内にファイルをダンプする方法については何の手がかりもありません。グーグル検索は私を暗闇に閉じ込めます。lessfileのプロパティはリクエストごとに変更される可能性があるため、ファイルを静的に配信する方法はないと思います。

これは、silex拡張機能の私の実装です。

$oApp = new Silex\Application();

//$oApp['autoloader']->registerNamespace('Assetic', DIR_VENDOR.'/assetic/src');
//$oApp['autoloader']->registerNamespace('SilexExtension', DIR_VENDOR.'/silex-extension/src');
//$oApp['autoloader']->registerNamespace('Twig', DIR_VENDOR.'/twig/lib');

$oApp->register(
    new Silex\Provider\TwigServiceProvider(), array(
        'twig.path' => DIR_ROOT.'/src/templates',
        'twig.class_path' => DIR_VENDOR.'/twig/lib',
    ),
    new SilexExtension\AsseticExtension(), array(
        'assetic.class_path' => DIR_VENDOR.'/assetic/src',
        'assetic.path_to_web' => DIR_ASSETS,
        'assetic.options' => array(
            'debug' => false,
            'formulae_cache_dir' => DIR_TMP.'/Assetic/cache',
            'twig_support' => true
        ),
        'assetic.filters' => $oApp->protect(function($fm) {
            $fm->set('yui_css', new Assetic\Filter\Yui\CssCompressorFilter(
                DIR_YUI.'/yuicompressor-2.4.7.jar'
            ));
            $fm->set('yui_js', new Assetic\Filter\Yui\JsCompressorFilter(
                DIR_YUI.'/yuicompressor-2.4.7.jar'
            ));
            $fm->set('googlecc_js', new Assetic\Filter\GoogleClosure\CompilerJarFilter(
                DIR_GOOGLE_CC.'/compiler.jar'
            ));
        }),
        'assetic.assets' => $oApp->protect(function($am, $fm) {
            $am>-set('styles', new Assetic\Asset\AssetCache(
                new Assetic\Asset\GlobAsset(
                    __DIR__ . '/resources/css/*.css',
                    array($fm->get('yui_css'))
                ),
                new Assetic\Cache\FilesystemCache(DIR_TMP.'/Assetic/cache')
            ));
            $am->get('styles')->setTargetPath(DIR_ASSETS.'/css/styles.css');
        })
    )
);

CSSファイルはより少ないフィルターで処理されているため(変数値はデータベースから取得する必要があります)、出力ファイルを保存/キャッシュする必要があります。必要なのは、output.cssをキャッシュディレクトリに書き込むAssetWriterと組み合わせたLazyAssetManagerだと思いますか?しかし、Twigテンプレート内から正しいインクルード構文を取得するのに本当に苦労しています。次の実装は機能していないようです。

{% stylesheets 'path/to/my/css' 'another/path/to/my/css' filter='yui_css' output='path/to/output/directory/styles.css' %}
<link href="{{ asset_url }}" rel="stylesheet" media="screen" />
{% endstylesheets %}

私の懸念に関するすべての投稿に感謝しています。

4

1 に答える 1

2

(あなたが言及した) less ファイルのプロパティはリクエストごとに変更される可能性があるため、assetic の使用を誤用していると思います (さらに少ないかもしれません)。アセットを少ないプリプロセッサとして使用しようとしているように思えますが、そうではありません+結果をキャッシュする理由はほとんどありません(これは、リクエストごとに実際に異なる頻度によって異なります)。

達成したいことについてはあまり詳しく説明しませんが、ユーザーが配色 (およびその他の外観変数) を変更できるテーマ エンジンのようなものだと思います。この場合、すべてのリクエストに共通の 1 つのテンプレートに大量の CSS/less ファイルを配置し、DB から変数を含むテーマ固有の css を配信するルートを silex アプリに設定する必要があると思います。

それらはリクエストごとに異なる可能性があるため、リクエストごとにサーバーの前処理オーバーヘッドを減らす理由はないと思います。そのため、ストレート CSS を出力する必要があります。慣れている場合は、せいぜい、クライアントに .less ファイルを処理させることができます。

于 2012-08-05T05:35:54.393 に答える