Loading JavaScript twice in Symfony

When I expand mine base.html.twig

, my JS is loaded twice. Here is my code:

{% block javascripts %}
{% javascripts
'@MyBundle/Resources/public/app/src/lib/jquery.js'
'@MyBundle/Resources/public/app/src/lib/jquery-ui.js'
'@MyBundle/Resources/public/app/src/lib/angular.js'
'@MyBundle/Resources/public/app/src/lib/ui-bootstrap-tpls-0.10.0.js'
'@MyBundle/Resources/public/app/src/lib/fullcalendar.js'
'@MyBundle/Resources/public/app/calendar.js'
'@MyBundle/Resources/public/app/src/lib/angular-route.js'
'@MyBundle/Resources/public/app/schedulePlanner.js'
 %}
<script type="text/javascript" src="{{ asset_url }}"></script>
{% endjavascripts %}

      

+1


source to share


1 answer


I had a similar problem that turned out to be caused by a misplaced tag {% endblock %}

.

Here's my basic view:

{# app/Resources/views/base.html.twig #}
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}{% endblock %}</title>
        {% block header %}{% endblock %}
        {% block stylesheets %}{% endblock %}
        <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
    </head>
    <body>
        <!--[if lt IE 9]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a>.</p>
        <![endif]-->

        {# debug #}
        {% if pre is defined and pre is not empty and app.environment == 'dev' %}
            <pre>
                {{ pre }}
            </pre>
        {% endif %}

        {% block body %}{% endblock %}
        {% block javascripts %}{% endblock %}
    </body>
</html>

      

And here is the extended package template:



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

{# title #}
{% block title %}{% endblock %}

{% block header %}
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width">
    <link href='http://fonts.googleapis.com/css?family=Pathway+Gothic+One' rel='stylesheet' type='text/css'>
{% endblock %}

{# style #}
{% block stylesheets %}
{% endblock %}

{# body #}
{% block body %}

    {% block content_header %}
        <div class="header"><div class="header-in">
            <header>
            </header>
        </div></div>

        <div class="nav"><div class="nav-in">
            <nav>
                <ul id="menu" class="menu clearfix">
                    {% block content_header_nav %}
                    {% endblock %}
                </ul>
            </nav>
        </div></div>
    {% endblock %}

    <div class="block"><div class="block-in">

        <div class="content"><div class="content-in clearfix">

            {% set notices = app.session.flashbag.get('notices') %}
            {% if notices is not empty %}
            <ul class="msg ajax-flash-msg">
              {% for notice in notices %}
              <li>{{ notice }}</li>
              {% endfor %}
            </ul>
            {% endif %}

            {% block content %}{% endblock %}

        </div></div>

    </div></div>

    <div class="footer"><div class="footer-in">
        <footer>
            {% block footer %}{% endblock %}
        </footer>
    </div></div>

    {# javascript #}
    {% block javascripts %}
    <script src="{{ asset('assets/require.js') }}"></script>
    {% endblock %}

{% endblock %}

      

You will notice that I had a javascript block inside a body block in the package template, which caused it to render the html twice, outputting the browser.

To fix, I moved the javascript block outside of the body block.

+11


source







All Articles