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

sen*_*rio 3 get symfony twitter-bootstrap glyphicons

我有一个关于symfony2和bootstrap的问题.我不明白为什么我可以从环境"prod"加载图标图像,但不能从环境"dev"加载.在开发中,我收到此错误.

路线是"GET /img/glyphicons-halflings.png".

Image web/img/glyphicons-halflings.png是../../vendor/twitter/bootstrap/img/glyphicons-halflings.png的符号链接

我得到这个错误

http://my.web.site/app_dev.php/img/glyphicons-halflings.png
Run Code Online (Sandbox Code Playgroud)

并获得图像

http://my.web.site/img/glyphicons-halflings.png
Run Code Online (Sandbox Code Playgroud)

UPDATE

我以这种方式包含bootstrap:

{% stylesheets '%kernel.root_dir%/../vendor/twitter/bootstrap/less/bootstrap.less' %}
    <link rel="stylesheet" type="text/css" href="{{ asset_url }}" />
{% endstylesheets %}
Run Code Online (Sandbox Code Playgroud)

当我在prod使用时,这是有效的

<span class="icon-edit"></span>
Run Code Online (Sandbox Code Playgroud)

我有这个资产配置:

assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        [ MyAwesomeBundle ]
    filters:
        lessphp:
            file: %kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php
            apply_to: "\.less$"
Run Code Online (Sandbox Code Playgroud)

我也试过创建我的收藏:

assetic:
    assets:
        senso:
            inputs:
                - '../img/glyphicons-halflings.png'
            outputs:
                - 'img/glyphicons-halflings.png'
            filters:
                - ?lessphp
Run Code Online (Sandbox Code Playgroud)

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

Nic*_*ich 12

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"
Run Code Online (Sandbox Code Playgroud)

config_dev.yml

assetic:
    use_controller: true
Run Code Online (Sandbox Code Playgroud)

template

{% 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 %}
Run Code Online (Sandbox Code Playgroud)

assetic:dump --no-debug跑完之后一切都完美无瑕.

基本信息

使用的cssrewrite过滤器即background-image: url("..")@Bundle-syntax 不兼容.

{% stylesheets 
   '@AcmeYourBundle/Resources/public/css/your.css' 
   filter="cssrewrite" 
%}   
Run Code Online (Sandbox Code Playgroud)

不起作用.

此外,url("../img/image.png")在没有cssrewrite的情况下,源代码将在开发环境中失败,并且assetic.use_controller: true- 可能的解决方法:使用类似URL url("/img/image.png")而不使用子文件夹中的页面.

你应该记住......

<img src="img/image.png">
Run Code Online (Sandbox Code Playgroud)

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

解:

<img src="{{ asset('img/image.png') }}">
Run Code Online (Sandbox Code Playgroud)

其他解决方案和提示

  • 包括IMG,CSS或JS时到您的网页总是用树枝的asset(),{% stylesheets %}{% javascripts %}功能.
  • 在样式表中使用相对网址即 url("../img/image.png")
  • 尝试设置assetic.use_controller: false你的config_dev.yml和所描述的抛售资产... 在这里
  • 创建资源集合config.yml,然后倾倒你的资产-看到我的答案在这里.
  • 使用cssembedded过滤器将您的图像包含在css中,使用data-uris - 这里引用
  • 配置您的网络服务器直接提供img/css/js文件夹中的文件,而不是通过symfony路由
  • 使用不同的主机名(即project.dev)app_dev.php作为目录索引的开发环境,导致url没有/app_dev.php/

你可以在这个问题的答案中找到关于这个主题的一些很好的信息.

我个人工作流程:

  • 本地通配符dns服务器引入自动生成的URL,如project.devproject.prod,...(没/app_dev.php/问题)
  • 在config.yml中创建资产集合(更清晰的模板,更多资产控制)
  • guard/grunt taskrunners而不是assetic:dump --watch(重新转储,但测试和优化)
  • source-maps和chrome-devtools而不是assetic assetic:dump --debug(参见组合文件的真实源文件,less,sass,coffeescript,......)
  • tincr(直接从devtools保存)和livereload(立即查看更改)