Php 在symfony 2.5中包括css和js文件_Php_Html_Twig_Symfony 2.5

Php 在symfony 2.5中包括css和js文件

php html twig

Php 在symfony 2.5中包括css和js文件,php,html,twig,symfony-2.5,Php,Html,Twig,Symfony 2.5,我使用的是symfony 2.5，虽然包含了css和js文件，但它们似乎可以工作，但当我在浏览器中查看源代码时，我看到多个css和js文件被包含在其中，因为我只包含了一次。这就是我的header.html.twig的样子 {% block head %} <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initia

我使用的是symfony 2.5，虽然包含了css和js文件，但它们似乎可以工作，但当我在浏览器中查看源代码时，我看到多个css和js文件被包含在其中，因为我只包含了一次。这就是我的

header.html.twig

的样子

{% block head %}
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
        <title>Home | Flat Theme</title>
        {% block stylesheets %}
            {% stylesheets '@DefaultBundle/Resources/public/css/*' %}
            <link rel="stylesheet" href="{{ asset('bundles/default/css/bootstrap.min.css') }}"/>
            <link rel="stylesheet" href="{{ asset('bundles/default/css/font-awesome.min.css') }}"/>
            <link rel="stylesheet" href="{{ asset('bundles/default/css/prettyPhoto.css') }}"/>
            <link rel="stylesheet" href="{{ asset('bundles/default/css/animate.css') }}/">
            <link rel="stylesheet" href="{{ asset('bundles/default/css/main.css') }}"/>
            {% endstylesheets %}
        {% endblock %}

        {% block topjavascripts %}
            {% javascripts '@DefaultBundle/Resources/public/js/*' %}
            <script src="{{ asset('bundles/default/js/html5shiv.js') }}"></script>
            <script src="{{ asset('bundles/default/js/respond.min.js') }}"></script>
            {% endjavascripts %}
        {% endblock %}
    </head>
{% endblock %}
<body>

{%block head%}
家庭|平面主题
{%块样式表%}
{%stylesheets'@DefaultBundle/Resources/public/css/*'%}
{%endstylesheets%}
{%endblock%}
{%block topjavascripts%}
{%javascripts'@DefaultBundle/Resources/public/js/*'%}
{%endjavascripts%}
{%endblock%}
{%endblock%}

这是我在浏览器中看到的源代码，您会注意到每个css和js文件都被提到了5次以上

我尝试从

{%stylesheets'@DefaultBundle/Resources/public/css/*'%}

中删除

@DefaultBundle/Resources/public/css/*

，但这样做会删除所有样式

我做错了什么

试试这个：

{% block head %}
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Home | Flat Theme</title>
    <link rel="stylesheet" href="{{ asset('bundles/default/css/bootstrap.min.css') }}"/>
    <link rel="stylesheet" href="{{ asset('bundles/default/css/font-awesome.min.css') }}"/>
    <link rel="stylesheet" href="{{ asset('bundles/default/css/prettyPhoto.css') }}"/>
    <link rel="stylesheet" href="{{ asset('bundles/default/css/animate.css') }}/">
    <link rel="stylesheet" href="{{ asset('bundles/default/css/main.css') }}"/>

    <script src="{{ asset('bundles/default/js/html5shiv.js') }}"></script>
    <script src="{{ asset('bundles/default/js/respond.min.js') }}"></script>
</head>
{% endblock %}
<body>

{%block head%}
家庭|平面主题
{%endblock%}

或者，如果不想显式调用每个文件，请尝试以下操作：

{% block head %}
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Home | Flat Theme</title>
    {% block stylesheets %}
        {% stylesheets 'bundles/default/css/*' filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}"/>
        {% endstylesheets %}
    {% endblock %}

    {% block topjavascripts %}
        {% javascripts '@DefaultBundle/Resources/public/js/*' %}
            <script src="{{ asset_url }}"></script>
        {% endjavascripts %}
    {% endblock %}
</head>
{% endblock %}
<body>

{%block head%}
家庭|平面主题
{%块样式表%}
{%stylesheets'bundles/default/css/*'filter='cssrerewrite'%}
{%endstylesheets%}
{%endblock%}
{%block topjavascripts%}
{%javascripts'@DefaultBundle/Resources/public/js/*'%}
{%endjavascripts%}
{%endblock%}
{%endblock%}

这很有趣

           {% stylesheets '@DefaultBundle/Resources/public/css/*' %}

使用这一点，您告诉模板引擎迭代assets目录中的所有css，并将所有的

添加到css中，这就是为什么它们会重复使用assets的次数，如文档所示：（）

您还可以包括位于捆绑包资源/公用文件夹中的资产。您需要运行php应用程序/控制台资产：install target[--symlink]命令，该命令将文件（或symlinks）移动到正确的位置。（目标默认为“web”）

要包含JavaScript文件，请在任何模板中使用javascripts标记：

{% javascripts '@AppBundle/Resources/public/js/*' %}
 <script src="{{ asset_url }}"></script>
{% endjavascripts %}

{%javascripts'@AppBundle/Resources/public/js/*'%}
{%endjavascripts%}

包括CSS样式表：

{% stylesheets 'bundles/app/css/*' filter='cssrewrite' %}
    <link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

{%stylesheets'bundles/app/css/*'filter='cssrerewrite'%}
{%endstylesheets%}

请注意，在包含JavaScript文件的原始示例中，您使用@AppBundle/Resources/public/file.js这样的路径引用了这些文件，但在本示例中，您使用实际的、可公开访问的路径：bundles/app/CSS引用了CSS文件。你可以使用，除了在CSS样式表中使用@AppBundle语法时，有一个已知问题导致cssrewrite筛选器失败。

我改进了您提供的一个有关CSS的解决方案，尽管您的

解决方案有效，但这会导致通过CSS使用图像的问题，因此我通过更新您的答案对其进行了一些改进，这是我编辑的

{%stylesheets'bundles/default/css/*'filter='cssrewite'%}

再次感谢