Ich spiele mit um Symfony2, und ich habe Probleme mit CSS und JS Dateien in Zweig Vorlage.Wie kann man CSS-Dateien in Symfony 2 und Twig einbinden?

Ich habe ein Bündel namens Webs/HomeBundle, innerhalb dessen ich HomeController mit indexAction haben, die einen Zweig Vorlagendatei macht:

public function indexAction() 
{ 
    return $this->render("WebsHomeBundle:Home:index.html.twig"); 
}

Das ist also einfach. Jetzt möchte ich einige CSS- und JS-Dateien in diese Twig-Vorlage einfügen. Vorlage sieht wie folgt aus:

<!DOCTYPE html> 
<html> 
<head> 
    {% block stylesheets %} 
     <link href="{{ asset('css/main.css') }}" type="text/css" rel="stylesheet" /> 
    {% endblock %} 
</head> 
<body> 
</body> 
</html>

Die Datei Ich mag würde einschließen, main.css Datei befindet sich in:

Webs/HomeController/Resources/public/css/main.css

Also meine Frage ist im Grunde, wie zum Teufel kann ich schließen einfache CSS-Datei im Zweig Vorlage?

Ich verwende Twig asset() Funktion und es trifft einfach nicht den richtigen CSS-Pfad. Auch ich diesen Befehl in der Konsole:

app/console assets:install web

Dabei wird ein neuer Ordner erstellt

/web/bundles/webshome/...

dies nur ist die Verknüpfung mit dem

src/Webs/HomeController/Resources/public/

richtig?

Fragen

Wo sehen Sie Ihr Asset Dateien platzieren, JS, CSS und Bilder? Ist es in Ordnung, sie in Bundle/Resources/public Ordner zu legen? Ist das der richtige Ort für sie?
Wie fügen Sie diese Asset Dateien in Ihre Twig Vorlage mit Asset-Funktion? Wenn sie in Öffentlichen Ordner sind, wie kann ich sie einbeziehen?
Sollte ich etwas anderes konfigurieren?

Quelle

2012-08-28 Limeni

Sie tun alles richtig, außer Weitergabe Ihres Bundle-Pfades an asset() Funktion.

Nach documentation - in Ihrem Beispiel sollte wie folgt aussehen:

{{ asset('bundles/webshome/css/main.css') }}

Tipp: Sie können auch Assets aufrufen: installieren mit --symlink Schlüssel, so dass es symbolische Links in Web-Ordner erstellen wird.Dies ist äußerst nützlich, wenn Sie häufig js oder css Änderungen zu übernehmen (auf diese Weise die Änderungen, angewandt auf src/YouBundle/Resources/public wird sofort in web Ordner ohne Notwendigkeit widerspiegeln assets:install wieder zu nennen):

app/console assets:install web --symlink

Auch, wenn Sie möchten, hinzufügen einige Assets in Ihrem Kind Vorlage, könnten Sie parent() Methode für den Zweig-Block aufrufen. In Ihrem Fall würde es so sein:

{% block stylesheets %} 
    {{ parent() }} 

    <link href="{{ asset('bundles/webshome/css/main.css') }}" rel="stylesheet"> 
{% endblock %}

Quelle

2012-08-28 19:10:01

app/console Vermögen: installieren --watch automatisch Vermögenswerte regenerieren, da sie – Radu

ändern @Radu ja, aber wenn Sie Symlinks erstellen Sie nicht brauchen die --watch – Zero

Und können Sie% Sheets% (assetic Funktion)-Tag verwenden:

{% stylesheets 
    "@MainBundle/Resources/public/colorbox/colorbox.css" 
    "%kerner.root_dir%/Resources/css/main.css" 
%} 
<link type="text/css" rel="stylesheet" media="all" href="{{ asset_url }}" /> 
{% endstylesheets %}

Sie Pfad zur CSS als Parameter (% parameter_name%) schreiben können.

Mehr über diese Variante: http://symfony.com/doc/current/cookbook/assetic/asset_management.html

Quelle

2013-05-31 10:08:44 ZhukV

Die anderen Antworten sind gültig, aber die Official Symfony Best Practices Vorgeschlagen ist mit dem web/ Ordner alle Assets zu speichern, statt verschiedene Bundles.

Die Streuung Ihrer Web-Assets über Dutzende von verschiedenen Bundles macht es schwieriger, sie zu verwalten. Das Leben Ihrer Designer wird viel einfacher sein, wenn alle Anwendungsressourcen an einem Ort sind.

Vorlagen auch von Zentralisierung Ihr Vermögen profitieren, weil die Links viel prägnanter sind [...]

ich dies darauf hindeutet, hinzufügen würde, dass Sie nur Mikro-Assets in Mikro-Bündel setzen B. einige Zeilen von Stilen, die nur für eine Schaltfläche in einem Schaltflächenpaket erforderlich sind.

Quelle

2016-05-27 07:35:23 aalaap

Im Fall verwenden Sie Silex fügen Sie den Symfony Asset- als Abhängigkeit:

composer require symfony/asset

Dann können Sie Asset Service Provider registrieren:

$app->register(new Silex\Provider\AssetServiceProvider(), array(
    'assets.version' => 'v1', 
    'assets.version_format' => '%s?version=%s', 
    'assets.named_packages' => array(
     'css' => array(
      'version' => 'css2', 
      'base_path' => __DIR__.'/../public_html/resources/css' 
     ), 
     'images' => array(
      'base_urls' => array(
       'https://img.example.com' 
      ) 
     ), 
    ), 
));

Dann in Ihrem Zweig Vorlagendatei im Kopfbereich:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    {% block head %} 
    <link rel="stylesheet" href="{{ asset('style.css') }}" /> 
    {% endblock %} 
</head> 
<body> 

</body> 
</html>

Quelle

2016-06-26 10:30:09 Trix

Per Dokumentation, sollten Sie auch hinzufügen twig- bridge ('composer benötigt symfony/twig-bridge') – Gianluca

Wie kann man CSS-Dateien in Symfony 2 und Twig einbinden?

Fragen

Antwort

Verwandte Themen