私はSymfony2ので遊んでいる、と私は小枝テンプレートでCSSとJSファイルなどの問題があります。Symfony 2とTwigにCSSファイルを含めるには？

私は小枝テンプレートファイルレンダリング私はindexActionでHomeControllerを持っている内Webs/HomeBundleという名前のバンドルがありますので、これは簡単です

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

を。今私がやりたいことは、このTwigテンプレートの中にいくつかのCSSとJSファイルを含めることです。テンプレートは次のようになります。私は含めたい

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

ファイル、main.cssファイルは次の場所にあります。

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

だから私の質問は、地獄は、私は小枝の内部で、単純なCSSファイルが含まれないか、基本的にテンプレート？

私はTwig asset()機能を使用しており、正しいCSSパスには当てられません。また、私は、コンソールで次のコマンドを実行します。これは

/web/bundles/webshome/...

新しいフォルダを作成し

app/console assets:install web

これはちょうど

src/Webs/HomeController/Resources/public/

右側にリンクしていますか？

質問

どこで資産ファイル、JS、CSS、およびイメージを置くのですか？ Bundle/Resources/publicフォルダに入れても構いませんか？それは彼らのための正しい場所ですか？
アセット機能を使用して、アセットのファイルをTwigテンプレートにどのように含めるのですか？それらがパブリックフォルダにある場合、どのようにそれらを含めることができますか？
別のものを設定する必要がありますか？

出典

2012-08-28 Limeni

asset()の機能にバンドルパスを渡す以外は、すべてを正しく行っています。 documentationによると

- あなたの例では、これは以下のようになります。

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

ヒント：あなたはまた、資産を呼び出すことができます。--symlinkキーをインストールし、それはウェブフォルダにシンボリックリンクを作成するように。あなたがしたい場合は、

app/console assets:install web --symlink

また：あなたは、多くの場合、（src/YouBundle/Resources/publicに適用される変更は、すぐに再びassets:installを呼び出すために必要とすることなく、webフォルダに反映されます。この方法で）jsまたはcss変更を適用する場合に非常に便利です子テンプレートの一部の資産をに追加すると、parent()メソッドを呼び出してTwigブロックを呼び出すことができます。あなたのケースでは、それはこのようになります：

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

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

出典

2012-08-28 19:10:01

アプリ/コンソール資産：彼らはイエス – Radu

@Raduを変更ができますが、シンボリックリンクを作成する場合は、ドキュメントを1として--watch – Zero

そして、あなたは％スタイルシート％（assetic機能）タグを使用することができます。

{% 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 %}

あなたは、パラメータ（％のPARAMETER_NAMEの％）としてのCSSのパスを書き込むことができます。この変形について

より：http://symfony.com/doc/current/cookbook/assetic/asset_management.html

出典

2013-05-31 10:08:44 ZhukV

他の回答は有効ですが、Official Symfony Best Practicesガイドではなく、異なるバンドルのすべての資産を、保存するためにweb/フォルダを使用することを提案しています。

ウェブアセットを数十の異なるバンドルに分散すると、の管理がより難しくなります。すべてのアプリケーションアセットが1つの場所にある場合は、デザイナーの人生は多くてになります。
リンクがはるかに簡潔であるため、テンプレートはまた、あなたの資産を集中化の恩恵を受ける
[...]

私はあなたが唯一のマイクロバンドル内のマイクロ資産を置くことが示唆されたことにより、これに追加したいですたとえば、ボタンバンドル内のボタンに必要な数行のスタイルなどです。

出典

2016-05-27 07:35:23 aalaap

あなたは依存関係としてsymfonyの資産を追加サイレックスを使用している場合：あなたのに続いて

$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' ) ), ), ));

：

composer require symfony/asset

その後、資産サービスプロバイダを登録することができTwigヘッドセクションのテンプレートファイル：

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

</body> 
</html>

出典

2016-06-26 10:30:09 Trix

を必要としませんよう--watchが自動的に資産を再生成しますインストールし、あなたもtwig-追加する必要がありますブリッジ（ '作者はsymfony/twig-bridge'を必要とします） – Gianluca

Symfony 2とTwigにCSSファイルを含めるには？

質問

答えて

関連する問題