How to make Symfony2 to load CSS, JS files directly and not via PHP?

Question

OLD QUESTION, SEE BELOW FOR THE UPDATED VERSION

My development environment is not the fastest. I takes roughly 500ms per PHP request. It's starting to become a problem with Symfony2 resource files because each of the resource files are being requested via Symfony's internal controllers:

http://localhost/myproj/app_dev.php/js/bb8690a_part_4_myJavaScriptFile_2.js

As can be seen, the files are loaded via the Symfony framework and not directly. Since I'm starting to have over 20 files to load, multiplying that with the 500ms makes page loads very slow. I want to load the files directly, but I am not sure how to do that.

This is part of the config.yml:

# Assetic Configuration
assetic:
    debug:          %kernel.debug%
    use_controller: false
    # java: /usr/bin/java
    filters:
        cssrewrite: ~

I thought setting use_controller to false would do it, but nope.

Is there a way to handle the loading of those resoures directly?

UPDATE:

This is the URL it tries to use now:

http://localhost/myproj/_controller/js/bb8690a_part_4_myJavaScriptFile_2.js

I have set use_controller to false for both dev and general configs. How do I get rid of that _controller part of the URL?

Edit: If I clear the cache, run assetic:dump and have use_controller as false, then upon reload I get Cannot load resource ".". I can't get around that problem unless I temporarily enable use_controller for one page load. After that, I disable it and reload and now it requests from that invalid URL that contains _controller.

It also seems to work in prod, but not in dev. Strange.

Template code:

{% stylesheets filter="cssrewrite"
            'bundles/outotecofil/css/reset.css'
            'bundles/outotecofil/css/*'

            output='css/dist/dist.css'
        %}
        <link rel="stylesheet" href="{{ asset_url }}" />
        {% endstylesheets %}

        {% javascripts
            '@OutotecCommonBundle/Resources/public/js/jquery-1.6.2.min.js'
            '@OutotecCommonBundle/Resources/public/js/jquery-ui-1.8.16.custom.min.js'
            '@OutotecCommonBundle/Resources/public/js/chosen.jquery.min.js'
            '@OutotecCommonBundle/Resources/public/js/widget/*'

            '@OutotecOFILBundle/Resources/public/js/OFILDependencyManager.js'
            '@OutotecOFILBundle/Resources/public/js/widget/*'
            '@OutotecOFILBundle/Resources/public/js/plant-scope.js'

            output='js/dist/dist.js'
        %}
        <script src="{{ asset_url }}"></script>
        {% endjavascripts %}

To be extremely clear: without app_dev.php (i.e. in prod mode), it works. Only in dev it does not and throws this "Cannot load resource "."" error unless I first enable use_controller for one request, after which I can disable it and reload though the URLs will then contain _controller/ in their paths.

Please show the code in your template where you call the assets. — Sgoettschkes, Nov 25 '11 at 08:26

score 21 · Accepted Answer · answered Nov 25 '11 at 15:40

21

Try to remove this part of code in routing_dev.yml when use_controller is false :

_assetic:
    resource: .
    type:     assetic

answered Nov 25 '11 at 15:40

ArthurM

226
1
2

five · Answer 2 · 2012-09-25T16:03:51.413

6

If you use assetic:dump, then you have to cache:clear -e dev

"...if you run cache:clear on your production cache, it warms up the cache with debug mode on. If you try to dump assets afterwards, weird things might happen."

i found it here: http://sftuts.com/using-assetic-in-symfony2-for-css-compression (4. paragraph)

edited Sep 25 '12 at 16:03

answered Jun 19 '12 at 15:51

five

276
3
4

It looks like that sftuts post is just talking about what to do in your production environment and the advice there shouldn't affect what you do in dev. Am I missing something? – Sam Jan 08 '14 at 16:43

gagarine · Answer 3 · 2014-04-10T12:33:29.743

6

From the documentation

Modify the dev config to avoid using the controller.

# app/config/config_dev.yml
assetic:
    use_controller: false

Remove the route in routing_dev.yml to avoid side effect

# app/config/routing_dev.yml
_assetic:
    resource: .
    type:     assetic

Automatically dump your css/less files every time you have a modification.

php app/console assetic:dump --watch

edited Apr 10 '14 at 12:33

answered Oct 14 '13 at 15:27

gagarine

4,190
2
30
39

score 6 · Answer 4 · answered Nov 24 '11 at 18:28

Symfony documentation is always the first place where to start look: How to Use Assetic for Asset Management

In the prod environment, your JS and CSS files are represented by a single tag each. In other words, instead of seeing each JavaScript file you're including in your source, you'll likely just see something like this:

<script src="/app_dev.php/js/abcd123.js"></script>

Moreover, that file does not actually exist, nor is it dynamically rendered by Symfony (as the asset files are in the dev environment). This is on purpose - letting Symfony generate these files dynamically in a production environment is just too slow.

Instead, each time you use your app in the prod environment (and therefore, each time you deploy), you should run the following task:

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

This will physically generate and write each file that you need (e.g. /js/abcd123.js). If you update any of your assets, you'll need to run this again to regenerate the file.

Okay, I got it further, now it's trying to load from `http://localhost/myproj/_controller/js/dist/dist_jquery-1.6.2.min_1.js`. Without the `_controller`, it would work. Why did it put that? — Tower, Nov 25 '11 at 07:39
that does work, and that's how I am doing it right now, but it's much slower with page loads since all CSS and JS files go through PHP/SF. — Tower, Nov 25 '11 at 10:52

score 1 · Answer 5 · answered Apr 08 '12 at 23:37

1

I have the same problem, working configuration is: comment out from routing_dev.yml:

_assetic:
 resource: .
 type:     assetic

set use_controller to false. After doing this I'm able to use assetic:dump and see working page.

answered Apr 08 '12 at 23:37

Karol Sikora

522
1
4
11

How to make Symfony2 to load CSS, JS files directly and not via PHP?

5 Answers5

Linked