2016-10-01 85 views
4

我試圖將所有使用的css文件合併爲一個。但是包含相對路徑的資源會導致問題。我試過資產的CssRewriteFilter,但它不起作用。CssRewrite過濾器不會將相對url轉換爲絕對

這裏是我的代碼:

$files = [ 
     '/node_modules/select2/dist/css/select2.min.css', 
     '/node_modules/jquery-datetimepicker/jquery.datetimepicker.css', 
     '/node_modules/icheck/skins/square/blue.css', 
     '/node_modules/Plupload/js/jquery.plupload.queue/css/jquery.plupload.queue.css', 
     '/node_modules/pace/themes/white/pace-theme-flash.css', 
     '/node_modules/lightgallery/dist/css/lightgallery.min.css', 
     '/node_modules/x-editable/dist/bootstrap3-editable/css/bootstrap-editable.css', 
     '/node_modules/sweetalert2/dist/sweetalert2.css', 
     '/node_modules/animate.css/animate.min.css', 
     '/node_modules/fullcalendar/dist/fullcalendar.min.css', 
     '/node_modules/flag-icon-css/css/flag-icon.min.css', 
     '/theme/assets/skin/default_skin/css/theme.css', 
    ]; 

    $am = new \Assetic\AssetManager(); 

    $items = []; 

    foreach ($files as $file) { 
     $filename = APP_ROOT_DIR . '/public/ui' . $file; 
     $items[] = new \Assetic\Asset\FileAsset($filename, [new \Assetic\Filter\CssRewriteFilter()]); 
    } 

    $collection = new \Assetic\Asset\AssetCollection(
     $items 
    ); 
    $collection->setTargetPath('vendor.css'); 

    $am->set('collection', $collection); 

    $writer = new \Assetic\AssetWriter(APP_ROOT_DIR . '/public/ui/shared/css/'); 
    $writer->writeManagerAssets($am); 

我期待什麼:

當IMG是/node_modules/test/css/test.css包含../img/test.png代碼Assetic應該把它改寫爲/node_modules/test/img/test.png

回答

1

嘗試構建您的FileAsset類像:

new \Assetic\Asset\FileAsset(
    $filename, 
    [new \Assetic\Filter\CssRewriteFilter()], 
    '/node_modules/test/' 
); 

src/Assetic/Asset/FileAsset.php:37中,我們看到您可以包含$sourcePath作爲第三個參數。

https://github.com/kriswallsmith/assetic/blob/master/src/Assetic/Asset/FileAsset.php#L37

您可能要rejig您$files陣列像

$files = [ 
    ['/node_modules/select2/dist/css/', 'select2.min.css'] 
    ... 
]; 

所以,你可以調用$sourcePath過兩次類似

new \Assetic\Asset\FileAsset(
    APP_ROOT_DIR . '/public/ui' . $file[0].$file[1], 
    [new \Assetic\Filter\CssRewriteFilter()], 
    '/public/ui'.$filename[0] 
); 
+0

你不是混亂$ sourceRoot (第三個參數)與$ sourcePath(第四個參數)。再次檢查鏈接中的代碼。你實際上正在複製功能。 – Phil