EzDevInfo.com

assetic

Asset Management for PHP

How to get the full url for an asset in Controller?

I need to generate some JSON content in controller and I need to get the full URL to an uploaded image situated here : /web/uploads/myimage.jpg.

How can I get the full url of it?

http://www.mywebsite.com/uploads/myimage.jpg


Source: (StackOverflow)

How to have Assetic + sass work with Symfony2 in Windows?

I'm trying to get Assetic to run within Symfony 2.0.11 in order to use sass for css files.

I've been fiddling around that issue for hours, and from what I gather the current assetic version (1.0.2) is screwed up and just can't work in windows.

I tried updating assetic and asseticBundle to the latest Master version from github, but those require Symfony 2.1 which brings in a lot of changes and is not backward compatible (not to mention it's not officially released either), so that's not an option.

This post symfony2 assetics yui compressor on windows (path syntax) gives some good insight on the matter, but unfortunately the changes on the assetic lib it recommends aren't enough to make it work properly in my environment.

I found some interesting bits also in https://github.com/kriswallsmith/assetic/commit/5621cd449b0d85316e5872d672e7e900edc2246c and https://github.com/kriswallsmith/assetic/issues/25

In the end, what I know is that I need to alter vendor/assetic/src/Assetic/Util/ProcessBuilder.php, maybe some other files in the package, and perhaps add some informations in my config.yml file (it seems adding the path to java or sass might help).

What I need is for someone who was able to get a working configuration to give me pointers onto what I'm missing, or ideally the steps required to have that damn thing work.

Anyone up to the task ?

___Update: Still digging, it's only been 3 days now :/

New elements :

1/ php5.3.8 may have an issue with proc_open and data > 2048 bytes as per https://bugs.php.net/bug.php?id=60120 This issue can have implications when getting symfony from the git repository ( https://github.com/symfony/symfony/issues/3216 ). issuing "git config --global core.autocrlf input" and re-fetching everything from git allowed me to use php5.3.10 without crash.

2/ https://github.com/kriswallsmith/assetic/commit/5621cd449b0d85316e5872d672e7e900edc2246c looks like a decent basis. I've maded some minor modifications on the paths in Process.php (cf https://github.com/kriswallsmith/assetic/issues/92 ) but I'm not really sure that is relevant. Anyhow, the command line I get from Assetic at this point works in a shell and outputs the expected css.

3/ sass.bat (located in Ruby193\bin) needs to have absolute path to ruby.exe in order to go a bit further (I learnt that the hard way, you only see the error message if you var_dump and kill the script at the right place!)

Now, things seem a bit better, but still not working with sass (I think it'd work fine with some other filters) I managed to isolate the issue in Process.php (around line 172) at "$data = fread($pipe, 8192);" : The second time the script passes at this place, with $pipe pointing to the second resource, it never returns... and php gets stuck and has really hard times coming out (I need to kill/restart wamp at least two times to be able to make another test)

I'm really not familiar with proc_open and streams, and I have difficulties understanding what the code is trying to do in there...

I hope this can help the next one trying to have things work, and eventually help my case too. Still looking for some support on the matter!

___Update:

Further testing made me realize that I could have "php app/console assetic:dump" work when the sass file was small enough. It seems to me that the actual css rules (excluding variable definitions and mixins) need to me smaller than 4096 bytes with php5.3.10, even less with php 5.3.8. That is pointing to the proc_open bug described in https://bugs.php.net/bug.php?id=60120 and https://bugs.php.net/bug.php?id=51800

___Update:

I tried to install php5.4 to check if it was fixing the issue. It took me some time to realize the reason this version was not working on my computer is because there is no x64 build yet. I then installed the 32bits version of wamp, and got php5.4 working with it easily. End result : proc_open still hangs :( I'm beginning to be out of ideas here...


Walkthrough:

So, eventually I got this to work, and thought I'd try to sum the most important steps up for later viewers :

1. Have Ruby 1.9.3 and compass 0.12 installed

check http://rubyinstaller.org/downloads/

Update compass to 0.12 with

"gem update --system"

and then

"gem install compass"

2. Alter compiler.rb in compass

Go to Ruby193\lib\ruby\gems\1.9.1\gems\compass-0.12.0\lib\compass in line 10, replace

self.from, self.to = File.expand_path(from), to

with

self.from, self.to = from.gsub('./', ''), to

/!\ with some setup, it may be the other way around, but with the setup I'm trying to describe, it goes this way.

3. point Assetic to the latest version that works with symfony 2.0.11

edit the deps file like such :

[assetic]
    git=http://github.com/kriswallsmith/assetic.git
    ;version=v1.0.2
    version=ac71449e46bed22c276da26bf54ab2f733b3801d
[AsseticBundle]
    git=http://github.com/symfony/AsseticBundle.git
    target=/bundles/Symfony/Bundle/AsseticBundle
    ;version=v1.0.1
    version=da4a46ce37557dcf3068b8493b12bdbbe47455e2

/!\ you'll need to remove the references to a specific version in the deps.lock file too !

and issue a "php bin/vendors install".

4. Change your config.yml

here's what mine looks like now :

# Assetic Configuration
assetic:
    debug:          %kernel.debug%
    use_controller: false
    # java: /usr/bin/java
    filters:
        compass:
            bin: e:\outils\Ruby193\bin\compass.bat

5. Use absolute path in compass.bat/sass.bat

Go to your Ruby193\bin directory and edit compass.bat to set an absolute path to ruby.exe (do the same with sass.bat while you're at it)

6. Change the call in template

Here's what mine looks like now :

{% stylesheets filter='compass' output='css/*.css'
        '@LndBimBundle/Resources/public/css/main.scss'
    %}
        <link rel='nofollow' href="{{ asset_url }}" type="text/css" rel="stylesheet" />
    {% endstylesheets %}

Testing :

For testing, you can use

php app/console assetic:dump --verbose --no-debug

That way if you get into an endless loop as I did, you can just ctrl+C, which makes testing way more efficient than in a browser

/!\ You absolutely need to use --no-debug, or you'll end up with a bunch of unwanted lines in your css that look like :

@media -sass-debug-info{filename{font-family:file\:\/\/C\:\/Users\/Mattso\/AppData\/Local\/Temp\/ass9DBF\.tmp\.scss}line{font-family:\0000359}}

You can use

die($this->commandline);

in the run method of

vendor\assetic\src\Assetic\Util\Process.php

to show you the current command line, and test it.

Mine currently looks like this :

cmd /V:ON /E:ON /C ""e:\outils\Ruby193\bin\compass.bat" "compile" "C:\Users\Mattso\AppData\Local\Temp" "--config" "C:\Users\Mattso\AppData\Local\Temp\ass59BB.tmp" "--sass-dir" "" "--css-dir" "" "C:\Users\Mattso\AppData\Local\Temp\ass59BC.tmp.scss""

Then you just need to type "php app/console assetic:dump --no-debug" in your cli to create the css files in web\css and refresh your site's page. Et... voila! (hopefully!)

Note: As you may have noticed, I'm using the CompassFilter instead of the SassFilter. That is because it does the same thing (and more) and can actually be made to do what we expect of it. If anyone can find out how to fix the SassFilter, that would be swell. Meanwhile I already spent way too much time on this.

I've been pulling my hair for days on that crazyness, I hope this post will be helpful to some other people's mental health ;)


Source: (StackOverflow)

Advertisements

Difference between assetic:dump and assets:install

In Symfony2, what is the difference between assetic:dump and assets:install? In what scenarios should each of these commands be used, and in what order (if order is relevant)?


Source: (StackOverflow)

Symfony 2 - Working with assets

I need some tips on how to work with assets in Symfony 2. For example, do we have to always perform the assets:update every time an image is added ? I know Assetic take care of the management on css and javascript files but what about images? What would be the best practice for the front-end development with Symfony 2 ? How do you guys setup your css, images and js files in your app to make it easy to develop, deploy and change ?


Source: (StackOverflow)

Symfony 2 Assetic Fatal error: Class 'Assetic\Util\PathUtils' not found on asset dump

I'm using Symfony version 2.1.10 with Assetic and after the last composer update I get the follwoing error when I try to run php app/console assetic:dump

Dumping all dev assets.
Debug mode is on.
Fatal error: Class 'Assetic\Util\PathUtils' not found in /vendor/symfony/assetic-bundle/Symfony/Bundle/AsseticBundle/Command/DumpCommand.php on line 216

I have no idea what is going wrong here. I checkt the GitHub issue page of Assetic and Symfony 2 and couldn't find any information ...

config.yml:

# Assetic Configuration
assetic:
    debug:          "%kernel.debug%"
    use_controller: false
    bundles:        ['FOSUserBundle', 'vaamoLandingPageBundle']
    #java: /usr/bin/java
    filters:
        cssrewrite: ~
        #closure:
        #    jar: "%kernel.root_dir%/Resources/java/compiler.jar"
        #yui_css:
        #    jar: "%kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar"

composer.js:

"require": {
        "php": ">=5.3.3",
        "symfony/symfony": "2.1.*",
        "doctrine/orm": ">=2.2.3,<2.4-dev",
        "doctrine/doctrine-bundle": "1.1.*",
        "twig/extensions": "1.0.*@dev",
        "symfony/assetic-bundle": "2.1.*",
        ...
    },

Source: (StackOverflow)

Path of assets in CSS files in Symfony 2

Problem

I have a CSS file with some paths in it (for images, fonts, etc.. url(..)).

My path structure is like this:

...
+-src/
| +-MyCompany/
|   +-MyBundle/
|     +-Resources/
|       +-assets/
|         +-css/
|           +-stylesheets...
+-web/
| +-images/
|   +-images...
...

I want to reference my images in the stylesheet.

First Solution

I changed all paths in the CSS file to absolute paths. This is no solution, as the application should (and has to!) be working in a subdirectory, too.

Second Solution

Use Assetic with filter="cssrewrite".

So I changed all my paths in my CSS file to

url("../../../../../../web/images/myimage.png")

to represent the actual path from my resources directory to the /web/images directory. This does not work, since cssrewrite produces the following code:

url("../../Resources/assets/")

which is obviously the wrong path.

After assetic:dump this path is created, which is still wrong:

url("../../../web/images/myimage.png")

The twig code of Assetic:

{% stylesheets
    '@MyCompanyMyBundle/Resources/assets/css/*.css'
    filter="cssrewrite"
%}
<link rel="stylesheet" rel='nofollow' href="{{ asset_url }}" />
{% endstylesheets %}

Current (Third) Solution

Since all CSS files end up in /web/css/stylexyz.css, I changed all paths in the CSS file to be relative:

url("../images/myimage.png")

This (bad) solution works, except in the dev environment: The CSS path is /app_dev.php/css/stylexyz.css and therefore the image path resulting from this is /app_dev.php/images/myimage.png, which results in a NotFoundHttpException.

Is there a better and working solution?


Source: (StackOverflow)

Assetic generating links but no files

I'm trying to use assetic in symfony2 to manage my css. The links are generated fine. However, no files are generated.

Here's my configuration:

Layout.html.twig

    {% stylesheets
      '@FooBundle/Resources/public/css/main.css'
      filter='cssrewrite'
    %}
    <link rel="stylesheet" rel='nofollow' href="{{ asset_url }}" />
    {% endstylesheets %}

Config.yml

assetic:
debug:          %kernel.debug%
use_controller: false
bundles:        [ FooBundle ]
filters:
    cssrewrite: ~

Config_dev.yml

assetic:
use_controller: true

Assetic generates te link foo.foo/app_dev.php/css/957d3aa_main_1.css. However, the file isn't there (or anywhere else). I've tried playing around with permissions and looking in the (nginx) logs, but nothing so far.

All help would be greatly appreciated.


Source: (StackOverflow)

Assetic unable to find file

I am trying to link a css file (that lives in a bundle) inside a twig template :

{% stylesheets 
    '@AcmeFooBundle/Resources/public/css/bootstrap.min.css' 
%}
    <link rel='nofollow' href="{{ asset_url }}" rel="stylesheet"/>
{% endstylesheets %}

The first error message I get is:

You must add AcmeFooBundle to the assetic.bundle config...

This is the config :

# Assetic Configuration
assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        []
    #java: /usr/bin/java
    filters:
        cssrewrite: ~
        #closure:
        #    jar: %kernel.root_dir%/Resources/java/compiler.jar
        #yui_css:
        #    jar: %kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar

Then I try to add AcmeFooBundle in the bundles directive but then I get an error:

Unable to find file....

I can't understand what I am doing wrong here...

Dumping the default configs of the assetic configuration in the console (using php app/console config:dump-reference assetic ) I can see AcmeFooBundle bundle listed in the bundles directive...


Source: (StackOverflow)

Pass a variable to an Assetic asset URL in Symfony2

Is there a way to pass a variable to the Assetic method in templates

{% stylesheets
    '@SomeExampleBundle/Resources/views/ SOMEVAR /css/*'
%}
<link rel="stylesheet" rel='nofollow' href="{{ asset_url }}" />
{% endstylesheets %}

So what I want to do is pass SOMEVAR from the controller.


Source: (StackOverflow)

Is it possible to compile Symfony2 assetic:dump and deploy that rather than run it on the server?

I have a problem on my production server where assetic:dump is timing out on a Capifony deploy (but not always).

Running assetic:dump locally is fine. Also deploying to a different staging (much less powerful) server is fine.

To fix this (and speed up deploy), I was wondering whether it's possible to run assetic:dump before a deployment and just send those complied assets along with the rest of the deployment?


Source: (StackOverflow)

Symphony 2 Assetic css and js 404 within production environment

I have installed Symphony2 framework and created my own bundle. I am using assetic for my js and css files.

I am running ubuntu on my server and mint on my local machine.

When I access the app_dev.php locally all assets serve just fine.

When I access the app.php locally all assets serve just fine.

However on my server, the route gets rendered but the assets (css & js) i get a 404.

When i tail the prod.log i get an uncaught Exception below:

 PHP Exception Symfony\Component\HttpKernel\Exception\NotFoundHttpException: "No route found for "GET /admin/css/875a243.css""

I have searched the web high and low and i cannot seem to figure this out.

I have cleared caches, assetic dumped, assets install , all permissions are correct.

my app routing.yml config:

    brs:
  resource: "@BrsAdminBundle/Resources/config/routing.yml"
  prefix: /

my bundle routing.yml config

admin:
  path: /admin/
  defaults: { _controller: BrsAdminBundle:Admin:index }

my app config:

imports:
    - { resource: parameters.yml }
    - { resource: security.yml }
    - { resource: assets.yml }

framework:
    #esi:             ~
    #translator:      { fallback: "%locale%" }
    secret:          "%secret%"
    router:
        resource: "%kernel.root_dir%/config/routing.yml"
        strict_requirements: ~
    form:            ~
    csrf_protection: ~
    validation:      { enable_annotations: true }
    templating:
        engines: ['twig']
        #assets_version: SomeVersionScheme
    default_locale:  "%locale%"
    trusted_proxies: ~
    session:         ~
    fragments:       ~
    http_method_override: true

# Twig Configuration
twig:
    debug:            "%kernel.debug%"
    strict_variables: "%kernel.debug%"

# Assetic Configuration
assetic:
    debug:          "%kernel.debug%"
    use_controller: false
    bundles:        [ ]
    #java: /usr/bin/java
    filters:
        cssrewrite: ~
        #closure:
        #    jar: "%kernel.root_dir%/Resources/java/compiler.jar"
        #yui_css:
        #    jar: "%kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar"

# Doctrine Configuration
doctrine:
    dbal:
        driver:   "%database_driver%"
        host:     "%database_host%"
        port:     "%database_port%"
        dbname:   "%database_name%"
        user:     "%database_user%"
        password: "%database_password%"
        charset:  UTF8
        # if using pdo_sqlite as your database driver:
        #   1. add the path in parameters.yml
        #     e.g. database_path: "%kernel.root_dir%/data/data.db3"
        #   2. Uncomment database_path in parameters.yml.dist
        #   3. Uncomment next line:
        #     path:     "%database_path%"

    orm:
        auto_generate_proxy_classes: "%kernel.debug%"
        auto_mapping: true

# Swiftmailer Configuration
swiftmailer:
    transport: "%mailer_transport%"
    host:      "%mailer_host%"
    username:  "%mailer_user%"
    password:  "%mailer_password%"
    spool:     { type: memory }

my asset.yml config:

assetic:
  assets:
    bootstrap_js:
      inputs:
        - '%Kernel.root_dir%/Resources/public/js/jquery-2.1.3.min.js'
        - '%Kernel.root_dir%/Resources/public/js/bootstrap.min.js'
    bootstrap_css:
      inputs:
        - '%Kernel.root_dir%/Resources/public/css/bootstrap.min.css'
        - '%Kernel.root_dir%/Resources/public/css/bootstrap-theme.min.css'
    admin_css:
      inputs:
        - '@BrsAdminBundle/Resources/public/css/styles.css'

my base.html.twig that uses assetic:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}BankRoll Supply{% endblock %}</title>
        {% block stylesheets %}
            {% stylesheets '@bootstrap_css' '@admin_css' %}
                <link rel="stylesheet" type="text/css" rel='nofollow' href="{{ asset_url }}" />
            {% endstylesheets %}
        {% endblock %}
        <link rel="icon" type="image/x-icon" rel='nofollow' href="{{ asset('favicon.ico') }}" />
    </head>
    <body>
        {% block body %}{% endblock %}
        {% block javascripts %}
            {% javascripts '@bootstrap_js' %} 
                <script type="text/javascript" src="{{ asset_url }}"></script>
            {% endjavascripts %}
        {% endblock %}
    </body>
</html>

Any help would be greatly appreciated.

Thank you,

Ad


Source: (StackOverflow)

How to add specific files to assetic?

I have my custom resources directory for my bundle where there are some files:

/longpathtoSymfony/src/MyOwn/Bundle/MyOwnBundle/Resources/public
|-- bootstrap
|   |-- css
|   |   |-- bootstrap-theme.css
|   |   |-- bootstrap-theme.min.css
|   |   |-- bootstrap.css
|   |   |-- bootstrap.min.css
|   |   `-- carousel.css
|   |-- fonts
|   |   |-- glyphicons-halflings-regular.eot
|   |   |-- glyphicons-halflings-regular.svg
|   |   |-- glyphicons-halflings-regular.ttf
|   |   `-- glyphicons-halflings-regular.woff
|   `-- js
|       |-- bootstrap.js
|       |-- bootstrap.min.js
|       |-- holder.js
|       `-- respond.min.js
|-- css
|   `-- custom.css
|-- fonts
|   |-- glyphicons-halflings-regular.svg
|   |-- glyphicons-halflings-regular.ttf
|   `-- glyphicons-halflings-regular.woff
|-- images
|-- img
`-- js
    |-- html5shiv.js
    |-- jquery-1.10.2.min.map
    |-- jquery.js
    `-- less-1.3.3.min.js

And all js and css files are correctly put to public folder, thus i can access to bootstrap/css/xxx.css files and so on, except font files.

I dont know what I should do to get them copied to the web directory. If I try php app/console assetic:dump then only the css and js files are copied:

php app/console assetic:dump
Dumping all dev assets.
Debug mode is on.

18:41:17 [file+] /longpathToSymfony/app/../web/css/bef717e.css
18:41:17 [file+] /longpathToSymfony/app/../web/css/bef717e_bootstrap.min_1.css
18:41:17 [file+] /longpathToSymfony/app/../web/js/6f9045a.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/6f9045a_html5shiv_1.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/6f9045a_respond.min_2.js
18:41:17 [file+] /longpathToSymfony/app/../web/css/0c1e28e.css
18:41:17 [file+] /longpathToSymfony/app/../web/css/0c1e28e_carousel_1.css
18:41:17 [file+] /longpathToSymfony/app/../web/js/0aa0509.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/0aa0509_jquery_1.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/0aa0509_bootstrap.min_2.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/0aa0509_holder_3.js
18:41:17 [file+] /longpathToSymfony/app/../web/js/0aa0509_less-1.3.3.min_4.js

What should I do to include font files too? I'm having the same problem with jquery-1.10.2.min.map, which is downloaded dynamically. Is there any way to say to symfony "hey put it in the web resource folder, because some of my components need it"?


Source: (StackOverflow)

Run CSS file through Twig when using {% stylesheets %} tag in Twig with Symfony2

I'm including CSS stylesheets in my template like so:

{% stylesheets
    "@SomeBundle/Resources/assets/css/default.css.twig"
    "@SomeBundle/Resources/assets/css/global.css.twig"
%}
    <link rel="stylesheet" rel='nofollow' href="{{ asset_url }}" />
{% endstylesheets %}

However I want to run these CSS files through Twig, is this in any way possible while using the {% stylesheets %} tag or does this require some other approach. I've already tried enabling a twig filter but that does not exist.


Source: (StackOverflow)

assetic - unable to write assets

Here's my directory structure (this is just a test project):

stan@mypc:/generate_assets$ sudo tree -L 3 -p
.
├── [drwxr-xr-x]  assets
│   └── [drwxr-xr-x]  css
│       ├── [-rw-r--r--]  test1.css
│       └── [-rw-r--r--]  test2.css
├── [-rw-r--r--]  composer.json
├── [-rw-r--r--]  composer.lock
├── [drwxrwxrwx]  public
├── [-rwxr-xr-x]  run
└── [drwxr-xr-x]  vendor
     ....skipping...

Here's my simple script ('run' file) that supposed to generate assets:

#!/usr/bin/env php

<?php
    //loading composer's autoload
    chdir(__DIR__);
    if (file_exists('vendor/autoload.php')) {
        include 'vendor/autoload.php';
    }

    use Assetic\Asset\AssetCollection;
    use Assetic\Factory\AssetFactory;
    use Assetic\Asset\FileAsset;
    use Assetic\Asset\GlobAsset;
    use Assetic\Filter\LessFilter;
    use Assetic\Filter\CssMinFilter;
    use Assetic\AssetWriter;
    use Assetic\AssetManager;

    //Asset manager
    $am = new AssetManager();

    //Add all css files
    $css = new GlobAsset('assets/css/*.css', array(new CssMinFilter()));
    $am->set('basecss', $css);

    // Dumping assets into public
    $writer = new AssetWriter('public');
    $writer->writeManagerAssets($am);

So - I expected that css files from assets/css would be combined, minified and dumped into public directory under name 'basecss.css'. Here 's the exception I get:

PHP Fatal error:  Uncaught exception 'RuntimeException' with message 'Unable to write file public/' in /generate_assets/vendor/kriswallsmith/assetic/src/Assetic/AssetWriter.php:106
Stack trace:
#0 /generate_assets/vendor/kriswallsmith/assetic/src/Assetic/AssetWriter.php(65): Assetic\AssetWriter::write('public/', '*{color:green}?...')
#1 /generate_assets/vendor/kriswallsmith/assetic/src/Assetic/AssetWriter.php(54): Assetic\AssetWriter->writeAsset(Object(Assetic\Asset\GlobAsset))
#2 /generate_assets/run(31): Assetic\AssetWriter->writeManagerAssets(Object(Assetic\AssetManager))
#3 {main}
  thrown in /generate_assets/vendor/kriswallsmith/assetic/src/Assetic/AssetWriter.php on line 106

So - It seems like assetic tries to dump file named as 'public' instead of 'public/basecss.css'? Any help?

P.S. RESOLUTION:

Ok. soo. Apparently I must run

$css->setTargetPath('css_file_name.css');   

And then it worked...


Source: (StackOverflow)

Symfony 2.3 - Using Twitter Bootstrap 3 with LESS, installed as a vendor through composer setup, unable to access Glyphicons fonts

I want to use the Twitter Bootstrap with Symfony 2 without using bundles. I've managed to install MopaBootstrapBundle, but decided to remove it and use plain TB.

Setup

composer.json

"require": {
    "twbs/bootstrap": "dev-master"
}

So, after installing with composer, the path [project_path]/vendor/twbs/bootstrap is identical to: https://github.com/twbs/bootstrap

config.yml

# Assetic Configuration
assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        [ ]
    filters:
        cssrewrite: ~
        less:
            node: /usr/bin/nodejs 
            node_paths: [/usr/lib/nodejs:/usr/lib/node_modules]
            apply_to: "\.less$"

I've created a new bundle for my project AcmeDemoBundle and added [project_path]/src/Acme/DemoBundle/Resources/public/less folder, containing two files:

  • variables.less - a copy of [project_path]/vendor/twbs/bootstrap/less/variables.less that I can modify without affecting the original TB's package
  • style.less

style.less contents:

@import "../../../../../../vendor/twbs/bootstrap/less/bootstrap.less";
@import "variables.less";

// any local changes should go below this line
[some local less code]

In base.html.twig

{% stylesheets '@AcmeDemoBundle/Resources/public/less/style.less' %}
    <link rel="stylesheet" rel='nofollow' href="{{ asset_url }}" />
{% endstylesheets %}

The Problem

Everything worked fine until I wanted to use the Glyphicons, included in Twitter Bootstrap.

<span class="glyphicon glyphicon-search"></span>

Glyphicons uses fonts to represent icons, located in Twitter Bootstrap here: https://github.com/twbs/bootstrap/tree/master/fonts

In order to use them, I had to create the following symlink.

[project_path]/web/fonts -> [project_path]/vendor/twbs/bootstrap/fonts/

In prod environment everything looks marvelous (except the font is displayed a little crispy), but in dev environment the font won't load because of /app_dev.php/ presence in the file location. So I get this error in the browser's console:

GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.woff 404 (Not Found) cmmp.localdev/app_dev.php/:1
GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.ttf 404 (Not Found) /app_dev.php/fonts/glyphicons-halflings-regular.ttf:1
GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.svg 404 (Not Found) /app_dev.php/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular:1

Using the cssrewrite filter only changes the errors in console for dev to:

GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.woff 404 (Not Found) cmmp.localdev/:75
GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.ttf 404 (Not Found) cmmp.localdev/:75
GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.svg 404 (Not Found) cmmp.localdev/app_dev.php/:75

The question

I've been struggling for a few days now and, despite the many questions and solutions found here on StackExchange, I wasn't able to fix this.

What am I missing? How should I fix this?


Source: (StackOverflow)