search

dbwebb-se / mvc

Course repo for the mvc and object orientation in frameworks course - mvc.
Other
1 stars 4 forks source link

Assets (CSS, JS, bilder) i Symfony med Twig #45

Open mosbth opened 2 years ago

mosbth commented 2 years ago

För att jobba på rätt sätt med statiska webbresurser såsom stylesheets, javascript-filer och bilder så använder vi säkrast funktionen asset() i våra Twig templatefiler.

Vi tänker oss att vi har en katalogstruktur som ser ut så här.

2022-04-01_14:56:31_212x263

Så här kan det se ut i base.html.twig för att referera till ovan resurser.

        <link rel="icon" href="{{ asset("favicon.ico") }}">
        <link rel="stylesheet" href="{{ asset("css/style.css") }}"/>

Så här kan det se ut när man inkluderar och länkar till en bild.

<img src="{{ asset("img/mos.png") }}" width="200px" alt="mos">

<a href="{{ asset("img/mos.png") }}">View the image</a>

Installera

För att lyckas med detta behöver du dels installera modulen asset och sedan behöver du konfigurera bort en referens till filen manifest.json, då blir det enklast att komma igång med användandet av asset.

Installera med composer.

composer require symfony/asset

Kommentera bort referensen till manifest.json i filen config/packages/webpack_encore.yaml.

framework:
    assets:
        #json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'

Om du missar kommentera bort manifest-filen får du troligen felmeddelandet.

An exception has been thrown during the rendering of a template ("Asset manifest file "public/build/manifest.json" does not exist.").

Läs mer