找不到“GET /img/glyphicons-halflings.png”的路线

Question

我有一个关于 symfony2 和 bootstrap 的问题。我不明白为什么我可以从环境“prod”而不是从环境“dev”加载图标图像。在开发中，我收到此错误。

路由是“GET /img/glyphicons-halflings.png”。

图像 web/img/glyphicons-halflings.png 是指向 ../../vendor/twitter/bootstrap/img/glyphicons-halflings.png 的符号链接

我收到此错误

http://my.web.site/app_dev.php/img/glyphicons-halflings.png

并使用

获取图像

http://my.web.site/img/glyphicons-halflings.png

更新

我以这种方式包含引导程序：

{% stylesheets '%kernel.root_dir%/../vendor/twitter/bootstrap/less/bootstrap.less' %}
    <link rel="stylesheet" type="text/css" href="{{ asset_url }}" />
{% endstylesheets %}

当我在 prod 中使用时，这是可行的

<span class="icon-edit"></span>

我有这个资产配置：

assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        [ MyAwesomeBundle ]
    filters:
        lessphp:
            file: %kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php
            apply_to: "\.less$"

我也尝试过创建我的收藏：

assetic:
    assets:
        senso:
            inputs:
                - '../img/glyphicons-halflings.png'
            outputs:
                - 'img/glyphicons-halflings.png'
            filters:
                - ?lessphp

:dump create web/assetic/senso.png 和 web/assetic/senso_glyphicons-halflings.png 但是，...如何使用 senso*.png 图像？

Answer 1

config.yml

assetic:
    use_controller: false
    filters:
         lessphp:
             file: "%kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php"
    assets:   
        img_bootstrap_glyphicons_black:
            inputs:
                -  "%kernel.root_dir%/../vendor/twitter/bootstrap/img/glyphicons-halflings.png"
            output: "img/glyphicons-halflings.png"

        img_bootstrap_glyphicons_white:
            inputs:
                -  "%kernel.root_dir%/../vendor/twitter/bootstrap/img/glyphicons-halflings-white.png"
        output: "img/glyphicons-halflings-white.png"

        css_bootstrap:
            inputs:
                -  "%kernel.root_dir%/../vendor/twitter/bootstrap/less/bootstrap.less"
            output: "css/bootstrap.css"
            filters:
                - lessphp

        js_bootstrap:
            inputs:
                -  "%kernel.root_dir%/../vendor/twitter/bootstrap/js/*.js"
            output: "js/bootstrap.js"

config_dev.yml

assetic:
    use_controller: true

模板

{% stylesheets '@css_bootstrap' %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css"/>
{% endstylesheets %}

{% javascripts '@js_bootstrap' %}
<script src="{{ asset_url }}" type="text/javascript"></script>
{% endjavascripts %}

在运行assetic:dump --no-debug 之后，一切正常。

一般信息

用于background-image: url("..") 的cssrewrite 过滤器与@Bundle 语法不兼容。

{% stylesheets 
   '@AcmeYourBundle/Resources/public/css/your.css' 
   filter="cssrewrite" 
%}   

不起作用。

此外，在没有 cssrewrite 和 assetic.use_controller: true 的开发环境中，url("../img/image.png") 之类的资源将失败 - 可能的解决方法：使用 url("/img/image.png") 之类的 url，但不能使用子文件夹中的页面。

你应该记住...

<img src="img/image.png">

... 将用于hostname/app_dev.php/ 和除hostname/ 之外的所有其他路由。

解决方案：

<img src="{{ asset('img/image.png') }}">

其他解决方案和提示

• 在页面中包含 img、css 或 js 时，请始终使用 twig 的 asset()、{% stylesheets %} 或 {% javascripts %} 函数。
• 在样式表中使用相对 url，即url("../img/image.png")
• 尝试在您的config_dev.yml 中设置assetic.use_controller: false 并转储您的资产...如here 所述
• 在 config.yml 中创建 asset collections，然后转储您的资产 - 请参阅我的 answer here。
• 使用 cssembedded 过滤器通过 data-uris 将图像包含在 css 中 - 参考 here
• 将您的网络服务器配置为直接在 img/css/js 文件夹中提供文件，而不是通过 symfony 路由
• 为开发环境使用不同的主机名（即project.dev），使用app_dev.php作为目录索引，导致url没有/app_dev.php/

您可以在this question 的回复中找到有关此主题的一些有用信息。

我的个人工作流程：

• 本地通配符 dns 服务器引入自动生成的 url，如 project.dev、project.prod、...（无 /app_dev.php/ 问题）
• 在 config.yml 中创建 asset collections（更简洁的模板，对资产的更多控制）
• guard / grunt taskrunners 而不是 assetic:dump --watch（在更改时重新转储，但也要进行测试和优化）
• source-maps 和 chrome-devtools 而不是assetic 的assetic:dump --debug（查看组合文件的真实源文件，less，sass，coffeescript，...）
• tincr（直接从 devtools 保存）和 livereload（立即查看更改）