répétition include script js

driven78
PHP Symfony

Bonjour à tous,
Besoin de vos lumières

j'ai quelques script js dans une vue qui herite d'un template de base.
Le probleme est que ces scripts se repetent plusieurs fois une fois la vue générée,

mon template de base: "base.html.twig"

<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="UTF-8">    
        <meta name="description" content="{% block description %}{% endblock %}"/>
        <base href="/">
        <title>{% block titre %}{% endblock %}</title>
        {% block stylesheets %}       
            {% stylesheets output="css/app.css" filter="scssphp, cssrewrite"
                'bundles/app/scss/style.scss'
                'app/scss/icomoon.scss'
            %}
            <link rel="stylesheet" href="{{ asset_url }}" />
            {% endstylesheets %}
        {% endblock %}
    </head>

    <body>
        {% block body %}{% endblock %}

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script>
        <script src="http://dinbror.dk/bpopup/assets/jquery.easing.1.3.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        {% block javascripts %}
            {% javascripts
                '@AppBundle/Resources/public/js/jquery.rateyo.js'
                '@AppBundle/Resources/public/js/jquery.sticky.js'
                '@AppBundle/Resources/public/js/jquery.tooltipster.js'
                '@AppBundle/Resources/public/js/jwplayer.min.js'
                '@AppBundle/Resources/public/js/stickEmUp.js' 
                '@AppBundle/Resources/public/js/flashNotification.js'
                '@AppBundle/Resources/public/js/engineJS.js'
            %}
            <script src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
            <script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}"></script>
            <script src="{{ asset_url }}"></script>
            {% endjavascripts %}
        {% endblock %}

    </body>
</html>

ma vue:

{% extends "::base.html.twig" %}

{% block body %}
    <div>Le content de ma page</div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {% javascripts
        '@AppBundle/Resources/public/js_additional/jRating.jquery.min.js'
        '@AppBundle/Resources/public/js_additional/jquery.mCustomScrollbar.min.js'
        '@AppBundle/Resources/public/js_additional/jquery.isotope.min_2.2.js'
    %}
    <script src="{{ asset_url }}"></script>
    <script>
        $(window).on("load", function () {
            $("#list").mCustomScrollbar({
                axis: "x",
                advanced: {autoExpandHorizontalScroll: true},
                scrollbarPosition: "outside",
                scrollButtons: {enable: true}
            });
        });
     </script>
    {% endjavascripts %}
{% endblock %}

J'ai des fichiers js dont l'application a besoin pour toutes les pages que je place dans mon layout de base, et je rajoute les fichiers js dont la vue a besoin, et il m'arrive de placer quelques scripts a la mano dans les vues.
Seulement avec cette architecture, le script " $(window).on("load", function () {..." apparait 3 fois une fois la vue générée.
J'ai du louper quelque chose dans la comprehension d'assetic.

1 réponse

Jonathan Dewaele

Salut,

Je n'ai jamais encore utilisé {% javascript %} mais tu appel deux fois le 

    <script src="{{ asset_url }}"></script>

une fois dans la base.html.twig puis ensuite une seconde fois dans la vue et comme il charge une première fois dans la base puis qu'il est rappeler dans la vue via le parent(), dans cette configuration je pense que le assert_url est appeler deux fois.

Essaye de mettre ton base.html.twig dans cette configuration:

<body>
        {% block body %}{% endblock %}

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script>
        <script src="http://dinbror.dk/bpopup/assets/jquery.easing.1.3.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        {% block javascripts %}
            {% javascripts
                '@AppBundle/Resources/public/js/jquery.rateyo.js'
                '@AppBundle/Resources/public/js/jquery.sticky.js'
                '@AppBundle/Resources/public/js/jquery.tooltipster.js'
                '@AppBundle/Resources/public/js/jwplayer.min.js'
                '@AppBundle/Resources/public/js/stickEmUp.js' 
                '@AppBundle/Resources/public/js/flashNotification.js'
                '@AppBundle/Resources/public/js/engineJS.js'
            %}
            {% endjavascripts %}
        {% endblock %}

             <script src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
            <script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}"></script>
            <script src="{{ asset_url }}"></script>

    </body>