Herkese merhaba!

Uzun yıllardır bol miktarda kişisel zaman ve enerji harcayarak bilgimizi hepinizle paylaşıyoruz. Ancak şu andan itibaren bu blogu çalışır durumda tutabilmek için yardımınıza ihtiyacımız var. Yapmanız gereken tek şey, sitedeki reklamlardan birine tıklamak olacaktır, aksi takdirde hosting vb. masraflar nedeniyle maalesef yayından kaldırılacaktır. Teşekkürler.

Bu örnekte symfony AsseticBundle kullanarak twig içinde css, js ve resimler gibi varlıkları yöneteceğiz. Daha fazla bilgi için How to Use Assetic for Asset Management sayfasını ziyaret edin.


Yükleme


Terminalde composer require symfony/assetic-bundle komutunu çalıştırın, "AppKernel.php" dosyasına new Symfony\Bundle\AsseticBundle\AsseticBundle(), satırını, "config.yml" dosyasınada aşağıdaki bölümü ekleyin.


assetic:
debug: '%kernel.debug%'
use_controller: '%kernel.debug%'
bundles: [FootballFrontendBundle]
read_from: "%kernel.root_dir%/../web"
write_to: "%kernel.root_dir%/../web"
filters:
cssrewrite: ~

Mevcut yapı


application
app
Resources
views
base.html.twig
src
Football
FrontendBundle
Resources
public
css
site.css
js
site.js
images
football.png
views
Default
index.html.twig
web
...

base.html.twig


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

index.html.twig


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

{% block body %}
{% image '@FootballFrontendBundle/Resources/public/images/football.png' %}
<img src="{{ asset_url }}" alt="Logo" />
{% endimage %}
<p>Home</p>
{% endblock %}

Assets yaratma


$ php bin/console assetic:dump --env=dev --no-debug

Dumping all dev assets.
Debug mode is off.

18:19:04 [dir+] /var/www/html/football/app/../web/images
18:19:04 [file+] /var/www/html/football/app/../web/images/7f83373.png
18:19:04 [dir+] /var/www/html/football/app/../web/css
18:19:04 [file+] /var/www/html/football/app/../web/css/88ab7e4.css
18:19:04 [dir+] /var/www/html/football/app/../web/js
18:19:04 [file+] /var/www/html/football/app/../web/js/0565161.js

Değişen yapı


application
...
...
web
css
88ab7e4.css
js
0565161.js
images
7f83373.png

Sayfanın kontrolü


# http://192.168.99.10:8081/app_dev.php/

<link rel="stylesheet" href="/app_dev.php/css/88ab7e4_part_1_site_1.css">

<img src="/app_dev.php/images/7f83373_football_1.png" alt="Logo" />

<script src="/app_dev.php/js/0565161_part_1_site_1.js"></script>