Search code examples
symfonyasseticphp-5.6

Optimizing Assets in Symfony Framework


I would like to add assets to each bundle that uses it.

This is my current config.yml config:

assets:
    bootstrap_css:
        inputs:
            #Original File
            - %kernel.root_dir%/Resources/less/billing.bootstrap.less
            - %kernel.root_dir%/../vendor/braincrafted/bootstrap-bundle/Braincrafted/Bundle/BootstrapBundle/Resources/less/form.less
            - %kernel.root_dir%/../vendor/components/font-awesome/less/font-awesome.less
            - %kernel.root_dir%/../src/HomeBundle/Resources/css/main.css
        filters:
            - lessphp
        output: css/bootstrap.css
    bootstrap_js:
        inputs:
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/transition.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/alert.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/button.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/carousel.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/collapse.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/dropdown.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/modal.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/tooltip.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/popover.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/scrollspy.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/tab.js
            - %kernel.root_dir%/../vendor/twbs/bootstrap/js/affix.js
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/bootbox.js
            - %kernel.root_dir%/../vendor/braincrafted/bootstrap-bundle/Braincrafted/Bundle/BootstrapBundle/Resources/js/bc-bootstrap-collection.js
        output: js/bootstrap.js
    jquery:
        inputs:
            - %kernel.root_dir%/../vendor/components/jquery/jquery.js
        output: js/jquery.js
    DataTables_css:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/css/DataTables/jquery.dataTables.css
        filters:
            - cssrewrite
        output: css/dataTables.css
    DataTables_js:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/DataTables/jquery.dataTables.min.js
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/DataTables/bootstrap.js
        output: js/dataTables.js
    #Xeditable
    xeditable_js:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/xeditable/bootstrap-editable.min.js
        output: js/xeditable.js
    xeditable_css:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/css/xeditable/bootstrap-editable.css
        output: css/xeditable.css
        filters:
            - cssrewrite
    growl_js:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/growl/jquery.bootstrap-growl.min.js
        output: js/growl.js
    sortable_js:
        inputs:
            - %kernel.root_dir%/../src/HomeBundle/Resources/js/sortable/source/js/jquery-sortable-min.js
        output: js/sortable.js

#java: /usr/bin/java
filters:
    lessphp:
        file: %kernel.root_dir%/../src/HomeBundle/Assets/Filter/lessc.php
        apply_to: "\.less$"
        # Formatter options: compressed, lessjs, classic
        formatter: "compressed"
        preserve_comments: false
    cssrewrite: ~
    #closure:
    #    jar: "%kernel.root_dir%/Resources/java/compiler.jar"
    #yui_css:
    #    jar: "%kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar"

I am compiling the Bootstrap js and css file from source to reduce the number of requests. Some of the Assets (Jquery Libraries) will be needed by some Bundles exclusivly. But I don't want to tell an user add these files to your main config. I don't feal that that is correct. So I am looking for a way to add them to bundle config files. But so far I could only find howtos and examples for router or service config. But not for the data in the main config file. I tried to add it as an extension but couldn't figure out how it works.

I tried this:

    $loader = new Loader\YamlFileLoader($container, new FileLocator(__DIR__.'/../Resources/config'));
    $loader->load('config.yml');

and added the stuff for the current module into the assetic section. But it didn't work. So what am I doing wrong?


Solution

  • Assets in config are predefined assets available in your app, so now you just need to reference to them in your templates.