2014-05-03 19 views
5

Làm thế nào để bao gồm các thư viện biểu tượng phông chữ css istalled thông qua nhà soạn nhạc trong/nhà cung cấp dir (fontawesome ví dụ). Bao gồm:Symfony2 - Assetic - biểu tượng phông chữ css

{% stylesheets filter='cssrewrite' 
    '%kernel.root_dir%/../vendor/fortawesome/font-awesome/css/font-awesome.min.css' %} 
    <link href="{{ asset_url }}" type="text/css" rel="stylesheet"/> 
{% endstylesheets %} 

Nhưng nó does't viết lại font chữ file url, nó vẫn giống nhau, và các biểu tượng wont tải:

src: url('../fonts/fontawesome-webfont.eot?v=4.0.3'); 

tôi biết, chúng ta không thể làm cho các url poined ngoài webroot, nhưng có thể assetic có thể đặt phụ thuộc này vào/web tự động?

Cách duy nhất tôi thấy bây giờ là sao chép nội dung này vào/web dir với tập lệnh sau khi cài đặt tổng hợp, nhưng tôi muốn tìm một cách tốt hơn.

Cảm ơn!

Trả lời

14

Khi được hỏi trên kênh #symfony và câu trả lời duy nhất tôi đã sử dụng để hỗ trợ với font-awesone là bao gồm chúng trong config.yml dưới sự hỗ trợ. Mã ban đầu là như sau:

assetic: 
    java: /usr/bin/java 
    use_controller: false 
    bundles: [ CorvusFrontendBundle, CorvusAdminBundle ] 
    assets: 
     font-awesome-otf: 
    inputs: '%kernel.root_dir%/Resources/public/fonts/FontAwesome.otf' 
    output: 'fonts/FontAwesome.otf' 
     font-awesome-eot: 
    inputs: '%kernel.root_dir%/Resources/public/fonts/fontawesome-webfont.eot' 
    output: 'fonts/fontawesome-webfont.eot' 
     font-awesome-svg: 
    inputs: '%kernel.root_dir%/Resources/public/fonts/fontawesome-webfont.svg' 
    output: 'fonts/fontawesome-webfont.svg' 
     font-awesome-ttf: 
    inputs: '%kernel.root_dir%/Resources/public/fonts/fontawesome-webfont.ttf' 
    output: 'fonts/fontawesome-webfont.ttf' 
     font-awesome-woff: 
    inputs: '%kernel.root_dir%/Resources/public/fonts/fontawesome-webfont.woff' 
    output: 'fonts/fontawesome-webfont.woff' 
    filters: 
    cssrewrite: ~ 
    yui_js: 
     jar: %kernel.root_dir%/Resources/java/yuicompressor-2.4.8.jar 
    lessphp: 
     file: "%kernel.root_dir%/../vendor/oyejorge/less.php/lessc.inc.php" 
     apply_to: "\.less$" 

Sau đó gọi file css như sau:

{# Common Stylesheets #} 
{% stylesheets filter="?cssrewrite" 
    '%kernel.root_dir%/Resources/public/css/font-awesome.min.css' 
    '@CorvusCoreBundle/Resources/public/css/common.less' 
%} 
    <link rel="stylesheet" href="{{ asset_url }}" /> 
{% endstylesheets %} 

Và cuối cùng bán phá giá các tập tin. Tuy nhiên, và theo kinh nghiệm của tôi, tôi nhận được các tệp trùng lặp cho chính phông chữ. Tôi có thể làm điều gì đó ngu ngốc.

HTH,

Tam

tín dụng: https://gist.github.com/ilikeprograms/a8db0ad7824b06c48b44

Cập nhật tháng 6 2015: Câu trả lời đã được đăng cho phiên bản 2.1/2.3 của Symfony2. Câu trả lời này có thể áp dụng hoặc không cho phiên bản mới nhất: bạn sẽ phải kiểm tra

+1

Các bản sao của bạn giống như sau: 'xxxxxx_font.eof',' xxxxxxx.eof'. Nếu đó là trường hợp của nó bởi vì bạn không sử dụng --env = prod. – Henry

+0

Đã lâu rồi tôi chưa sử dụng câu trả lời này kể từ khi tôi trả lời. Nhưng tôi nghĩ là vậy. Cảm ơn bạn đã bình luận. :) – thoroc

+1

Tôi đang sử dụng Symfony 2.7 và nó đặt phông chữ để assetic/fonts_glyphicons_halflings_regular_woff2.woff2 thay vì fonts/glyphicons-Halflings-regular.woff2 'fonts_glyphicons_halflings_regular_woff2: đầu vào:% kernel.root_dir%/../vendor/almasaeed2010 /adminlte/bootstrap/fonts/glyphicons-halflings-regular.woff2 kết quả đầu ra: phông chữ/glyphicons-halflings-regular.woff2' –

6

Câu trả lời tuyệt vời ở trên nhưng trong trường hợp phông chữ của bạn không được lưu trữ trong thư mục ứng dụng ở trên sẽ không hoạt động. Các tệp CSS của tôi được giữ trong gói của riêng tôi, vì vậy để đảm bảo chúng được tìm thấy, tôi cần phải định cấu hình app/config/config.yml như vậy;

assetic: 
    debug:   "%kernel.debug%" 
    use_controller: false 
    bundles: 
     - AjtrichardsAdminBundle 
     - AjtrichardsMainBundle 
    assets: 
     font-awesome-ttf: 
     inputs: '@AjtrichardsMainBundle/Resources/public/fonts/icons.ttf' 
     output: 'fonts/icons.ttf' 
     font-awesome-woff: 
     inputs: '@AjtrichardsMainBundle/Resources/public/fonts/icons.woff' 
     output: 'fonts/icons.woff' 
Các vấn đề liên quan