How to include CSS and Javascript Files As Assets In Twig

You can use asset() function to access your css and javascript files in twig blocks as shown below.

base.html.twig

You need to place css in web/assets/css/ and js in web/assets/js/ folders.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>{% block title %}Welcome!{% endblock %}</title>
        {% block stylesheets %}
            <link href="{{ asset('assets/css/common.css') }}" rel="stylesheet" />
        {% endblock %}
        <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
    </head>
    <body>
        {% block body %}{% endblock %}
        {% block javascripts %}
            <script src="{{ asset('assets/js/common.js') }}"></script>
        {% endblock %}
    </body>
</html>

#twig #css #javascript #twig

base.html.twig

inanzzz.com

How to include CSS and Javascript Files As Assets In Twig