Geek Answers Handbook

Assets and my assets

I am new to symfony 2 and Assetic. I would like to use assetic and Sass for my CSS. I am using Custom Fonts. I create in my package in the "Resources" section the "assets / css" folder, inside which there are _base.scss and main.scss. In my shared folder, I:

  • CSS
  • Fonts
  • Images
  • Js

In fonts, I have my own custom fonts.

In my SCSS, I extract my fonts and my images as follows:

@include font-face("billabongregular", font-files("/bundles/Mybundle/fonts/billabong-webfont.ttf")); background: $bg_header url("/bundles/Mybundle/images/darkGreyBackground.jpg") fixed no-repeat top center;

I have this path after assets: install, and I have a file under web / mybundle / fonts and web / mybundle / images

When I do php app/console assetic:dump --env=prod --no-debug

I have on my network:

  • CSS
  • js (public folder)

But I don't have folders with folders and font folders. If IO sees the source code in the images, I have this path /bundles/Mybundle/images/darkGreyBackground.jpg

Why don't I have a folder on the Internet? Is it correct to call my images and my fonts with /bundles/Mybundle/images/darkGreyBackground.jpg and / bundles / Mybundle / fonts / billabong-webfont.ttf?

+4
source share
2 answers

This is the standard and expected behavior when the symbolic links of your package resources are under web/bundles/Mybundle/ after calling the php app/console assetic:dump .

To use the path you created in your css, you can use the cssrewrite filter or even simpler, your css and images folders are in the same main folder, use the relative path:

 @include font-face("billabongregular", font-files("../fonts/billabong-webfont.ttf")); background: $bg_header url("../images/darkGreyBackground.jpg") fixed no-repeat top center;

EDIT

In your package, if you want the file to be accessible in the web directory after running the assets:install command, you must place them in the Resources/public/ directory, as indicated here: http://symfony.com/doc/current/book /page_creation.html#bundle-directory-structure

+1
source

I had the same problem and I just tried using the following as a workaround. Seems to work so far.

 {% stylesheets output='assets/fonts/glyphicons-halflings-regular.ttf' 'bundles/bootstrap/fonts/glyphicons-halflings-regular.ttf' %}{% endstylesheets %}

Pay attention to the absence of any output, which means that nothing is displayed on the template. When I run assetic: dump, the files are copied to the right place, and css includes the work as expected.

-1
source

More articles:


All Articles