incorrect asset url for sonata admin assets

1.8k Views Asked by At

I have changed configuration in Symfony2 in order to dump assets in AWS S3.

# app/AppKernel.php

/**
 * {@inheritdoc}
 */
public function boot()
{
    parent::boot();

    $s3client = new \MyVendor\SiteBundle\Entity\S3AssetManager(
        $this->container->getParameter('aws_access_key'),
        $this->container->getParameter('aws_secret_key'),
        $this->container->getParameter('aws_s3_region')
    );

    $s3client->registerStreamWrapper();
}

And:

# app/config_prod.yml
framework:
    templating:
        assets_base_url: "http://myAssetsHost.com/"

assetic:
    write_to: 's3://myAssetsHost.com'

Here's what I use in my views:

    {% block stylesheets %}
        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,greek" />
        {% stylesheets
        'bundles/mysite/css/screen.css'
        filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
        {% endstylesheets %}
    {% endblock %}

It works fine in frontend, and my urls are like this:

http://myAssetsHost.com/css/cc04b97.css

In backend (/admin/dashboard), urls are generated like this:

http://myAssetsHost.com/bundles/sonataadmin/vendor/bootstrap/dist/css/bootstrap.min.css

which result in 404 because files are not generated. Sonata (default) standard_layout.html.twig:

        {% for stylesheet in admin_pool.getOption('stylesheets', []) %}
            <link rel="stylesheet" type="text/css"  href="{{ asset(stylesheet) }}"  />
        {% endfor %}

During deployment I use these two commands to dump assets:

  php app/console cache:clear --env=prod
  php app/console assetic:dump --env=prod

How can I make Assetic pick up all bundle's assets in order to publish them to S3?

1

There are 1 best solutions below

0
On

Here's how I solved it:

# app/config.yml
sonata_admin:
...
templates:
    layout:  SonataAdminBundle::standard_layout_override.html.twig

since twig's asset() does not generate same URL as assetic stylesheets & javascripts block, I created a file that overrides stylesheets & javascripts block:

# app/Resources/SonataAdminBundle/views/standard_layout_override.html.twig
{% extends 'SonataAdminBundle::standard_layout.html.twig' %}

{% block stylesheets %}
    {% stylesheets
        'bundles/sonataadmin/vendor/bootstrap/dist/css/bootstrap.min.css'
        'bundles/sonataadmin/vendor/AdminLTE/css/font-awesome.min.css'
        'bundles/sonataadmin/vendor/AdminLTE/css/ionicons.min.css'
        'bundles/sonataadmin/vendor/AdminLTE/css/AdminLTE.css'
        'bundles/sonatacore/vendor/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css'
        'bundles/sonataadmin/vendor/jqueryui/themes/base/jquery-ui.css'
        'bundles/sonataadmin/vendor/select2/select2.css'
        'bundles/sonataadmin/vendor/select2/select2-bootstrap.css'
        'bundles/sonataadmin/vendor/x-editable/dist/bootstrap3-editable/css/bootstrap-editable.css'
        'bundles/sonataadmin/css/styles.css'
        'bundles/sonataadmin/css/layout.css'
        filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

{% block javascripts %}
    <script>
        window.SONATA_CONFIG = {
            CONFIRM_EXIT: {% if admin_pool is defined and admin_pool.getOption('confirm_exit') %}true{% else %}false{% endif %},
            USE_SELECT2: {% if admin_pool is defined and admin_pool.getOption('use_select2') %}true{% else %}false{% endif %},
            USE_ICHECK: {% if admin_pool is defined and admin_pool.getOption('use_icheck') %}true{% else %}false{% endif %}
        };
        window.SONATA_TRANSLATIONS = {
            CONFIRM_EXIT:  '{{ 'confirm_exit'|trans({}, 'SonataAdminBundle')|escape('js') }}'
        };
        </script>

    {% javascripts
        'bundles/sonataadmin/vendor/jquery/dist/jquery.min.js'
        'bundles/sonataadmin/vendor/jquery.scrollTo/jquery.scrollTo.min.js'
        'bundles/sonatacore/vendor/moment/min/moment.min.js'
        'bundles/sonataadmin/vendor/bootstrap/dist/js/bootstrap.min.js'
        'bundles/sonatacore/vendor/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js'
        'bundles/sonataadmin/vendor/jqueryui/ui/minified/jquery-ui.min.js'
        'bundles/sonataadmin/vendor/jqueryui/ui/minified/i18n/jquery-ui-i18n.min.js'
        'bundles/sonataadmin/jquery/jquery.form.js'
        'bundles/sonataadmin/jquery/jquery.confirmExit.js'
        'bundles/sonataadmin/vendor/x-editable/dist/bootstrap3-editable/js/bootstrap-editable.min.js'
        'bundles/sonataadmin/vendor/select2/select2.min.js'
        'bundles/sonataadmin/App.js'
        'bundles/sonataadmin/Admin.js'
    %}
    <script type="text/javascript" src="{{ asset_url }}"></script>
    {% endjavascripts %}
{% endblock %}

Note, it does not call {{ parent() }} since I don't want to load non existing files.

The only problem with this approach is that it completely ignores

admin_pool.getOption('stylesheets', []) admin_pool.getOption('javascripts', [])

so if a new stylesheet/js file is added in next SonataAdminBundle version, I will have to keep an eye and update my file as well.

Unfortunately, {% stylesheets %} and {% javascripts %} are both unable to handle arrays. If that was possible, you could do:

{% stylesheets filter='cssrewrite'  
admin_pool.getOption('stylesheets', []) %}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}