UserFrostingログインシステムのアセットマネージャをインストールするにはどうすればいいですか？

Question

ログインシステムにuserFrostingを使用しましたが、cssファイルを含めるのに問題があります。 私はこのコード

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

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

又はこれを使用しました。

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

{{ asset('css/style.css') }} 
{% endblock %} 

またはこれです。

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

<link href="css/style.css" rel="stylesheet"> 
{% endblock %} 

しかし、私はcssを含めることができなかったとページがローカルホストページが動作していないError500を示しています。どのように問題を見つけ出すことができますか？ アセットマネージャをインストールするにはどうすればよいですか？

Answer 1

CSSファイルへの相対パスをinitialize.phpに追加します。 UserFrosting 0.3.1には、表示されるページの種類に基づいてアセットをグループ化できる基本的な資産管理システムがあります。

たとえば、すべてのアナリティクスページにグラフを描画するためのCSSライブラリとJavascriptライブラリを読み込みたいとします。 「analytics」グループにページを割り当てるには、{% set page_group = "analytics" %}をページのTwigテンプレートの上部に追加します。

その後、あなたはinitialize.phpで "分析" グループのためのCSSやJSの資産を登録することができます。

$app->hook('includes.css.register', function() use ($app){ 

    ... 

    $app->schema->registerCSS("analytics", "supercharts/supercharts.css"); 
    $app->schema->registerCSS("analytics", "supercharts-custom.css"); 
}); 

$app->hook('includes.js.register', function() use ($app){ 

    ... 

    $app->schema->registerJS("analytics", "supercharts/supercharts.js"); 
}); 

注目に値するいくつかのこと：

• をすべてCSS資産はpublic/cssに置かなければならないが、すべてのJS資産はpublic/jsです。
• commonグループのアセットには、のすべてのページが読み込まれます。
• サイト設定でビルドツールを使用して、各ページグループ内のアセットを縮小および連結することができます。これにより、サイトの読み込み速度が向上し、ユーザーエクスペリエンスが向上します。 Google Developersでクライアント側のリソースを最適化する方法について詳しく知ることができます。

このすべては、我々は、資産のコンパイル/最適化を実行するためのNode.jsとガルプとともに、new asset management libraryを使用するUF4、に変更されることに注意してください。