使用 Silex/SilexExtensions 和 Assetic 在 Twig 中动态 CSS/Javascript
Posted
技术标签:
【中文标题】使用 Silex/SilexExtensions 和 Assetic 在 Twig 中动态 CSS/Javascript【英文标题】:Dynamic CSS/Javascript in Twig using Silex/SilexExtensions and Assetic 【发布时间】:2012-02-13 22:50:37 【问题描述】:我想要做什么: 从数据库中获取 CSS 属性并将其转储到一个 less 文件中。然后对其应用 less/yui 压缩过滤器并将输出转储到我的树枝模板中。
让我直接进入正题:
我有一个使用 Silex 和 Twig 作为模板引擎的 php Web 应用程序。为了处理和缩小 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 文件是通过较少的过滤器处理的(变量值应该来自数据库),我需要保存/缓存输出文件。我想我需要的是一个 LazyAssetManager 和一个将 output.css 写入缓存目录的 AssetWriter?但我真的很难从我的树枝模板中获得正确的包含语法。以下实现似乎不起作用:
% 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 %
感谢我发布的所有关于我的担忧的帖子。
【问题讨论】:
您是否有任何特定原因与当前设置相关联? ..使用 Twig 和 Silex 是吗? 我会说你可能是这个领域的先驱,小辈——在放弃 Assetic 并采用内部解决方案之前,我长期努力寻找有用的解决方案。 Symfony 邮件列表实际上可能对寻找解决方案更有用。 @smftre 基本上我们需要一个苗条的框架,并想在 Smarty 2.x 上尝试一个新的模板引擎。我们绝对不想坚持那对。 【参考方案1】:由于(您提到)less 文件中的属性可以根据请求更改,我认为您误用了资产(甚至可能更少)。听起来您正在尝试将资产用作较少的预处理器,但这不是+几乎没有理由缓存结果(这取决于每个请求它们实际不同的频率)。
您没有详细说明您想要实现的目标,但我认为它类似于主题引擎,用户可以在其中更改他们的配色方案(和其他外观变量)。如果是这种情况,我认为您应该将大部分 CSS/less 文件放在一个模板中,该模板适用于所有请求,然后在您的 silex 应用程序中设置一个路由,以提供带有来自数据库的变量的特定于主题的 css。
由于每个请求它们可能不同,我认为没有理由为每个请求在服务器上增加较少的预处理开销,因此您应该直接输出 CSS。如果您愿意,最多可以让客户端处理 .less 文件。
【讨论】:
以上是关于使用 Silex/SilexExtensions 和 Assetic 在 Twig 中动态 CSS/Javascript的主要内容,如果未能解决你的问题,请参考以下文章
在使用加载数据流步骤的猪中,使用(使用 PigStorage)和不使用它有啥区别?
Qt静态编译时使用OpenSSL有三种方式(不使用,动态使用,静态使用,默认是动态使用)