【问题标题】:404 error from css asset was called in dev在开发中调用了来自 css 资产的 404 错误
【发布时间】:2013-11-19 19:27:08
【问题描述】:

我不明白为什么,但是由于 Assetic 的原因,我的包的图像没有被正确调用。 我试着用:

background-image: url('../images/bg-header-1.jpg');

在我的 VisualImmersion/SiteBundle/Resources/public/css/home.css 和我的图片中:VisualImmersion/SiteBundle/Resources/public/images/bg-header-1.jpg

我认为我在总体布局中对资产使用了很好的方法:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="robots" content="follow">
        <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'/>
        <title>{% block title %} Visual Immersion - Agence de communication {% endblock %}</title>
        <meta name="description" content="Agence de communication | Développement web - Référencement SEO / Adwords - Développement mobile / tablettes - Brand design - Community Management - Evènementiel ">
        <link rel="icon" type="image/png" href="{{ asset('css/images/favicon.png') }}"/>
        {% stylesheets filter= 'cssrewrite'
            'css/stylesheets/layout.css'
            'css/stylesheets/style.css'
            'css/stylesheets/font.css'
            'css/stylesheets/responsive.css'
            'css/stylesheets/personalized-responsive.css'
            '@VisualImmersionSiteBundle/Resources/public/css/*'
        %}
            <link rel="stylesheet" type="text/css" href="{{ asset_url }}">

        {% endstylesheets %}
        {% block javascripts %}
            <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
            <script src="http://twitterjs.googlecode.com/svn/trunk/src/twitter.min.js"></script>
            <script>
                (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

                ga('create', 'UA-41814706-1', 'visual-immersion.com');
                ga('send', 'pageview');

            </script>
        {% endblock %}
    </head>

但是没有图片...

提前感谢您的帮助

编辑:我的 dev_config.yml

imports:
    - { resource: config.yml }

framework:
    router:
        resource: "%kernel.root_dir%/config/routing_dev.yml"
        strict_requirements: true
    profiler: { only_exceptions: false }

web_profiler:
    toolbar: true
    intercept_redirects: false

monolog:
    handlers:
        main:
            type:  stream
            path:  %kernel.logs_dir%/%kernel.environment%.log
            level: debug
        firephp:
            type:  firephp
            level: info
        chromephp:
            type:  chromephp
            level: info

assetic:
    use_controller: true
    filters:
        cssrewrite: ~

那是我的 6de3e66_part_6_home_1.css:

background-image: url('../../Resources/public/images/bg-header-1.jpg');

【问题讨论】:

  • 您的 CSS 指向一个名为“images”(复数)的文件夹: background-image: url('../images/bg-header-1.jpg');但实际路径是“图像”(单数)
  • 您是否忘记运行assets:install 命令?
  • 您好,复制/粘贴错误,我的目录是图像。对不起这个错误。我编辑了它。
  • @PeterBailey 我做了缓存:清除命令、资产:安装和资产:转储。没有更多的成功。
  • 您的config.yml 中是否还有其他全局过滤器?

标签: css url symfony assetic assets


【解决方案1】:

在这里查看我的答案CSS/JS/Images from Bundle location will be always removed after composer.phar update

我解释了如何使用 Resources/public 目录来管理图片等资产。

【讨论】:

  • 您好,我在作曲中设置了这个设置。和资产:安装 - 符号链接,我从一开始就这样做了。正是带着这些顾虑,我决定恢复资产命令:install to be on。
【解决方案2】:

好的,我做了一些测试:

我将 cssrewrite 删除到我的 config_dev.yml。 它:

imports:
    - { resource: config.yml }

framework:
    router:
        resource: "%kernel.root_dir%/config/routing_dev.yml"
        strict_requirements: true
    profiler: { only_exceptions: false }

web_profiler:
    toolbar: true
    intercept_redirects: false

monolog:
    handlers:
        main:
            type:  stream
            path:  %kernel.logs_dir%/%kernel.environment%.log
            level: debug
        firephp:
            type:  firephp
            level: info
        chromephp:
            type:  chromephp
            level: info

assetic:
    use_controller: true

我在我的总体布局中将注释从 cssrewrite 过滤器中移出:

{% stylesheets '@VisualImmersionSiteBundle/Resources/public/css/*'  filter='cssrewrite'
    'css/stylesheets/layout.css'
    'css/stylesheets/style.css'
    'css/stylesheets/font.css'
    'css/stylesheets/responsive.css'
    'css/stylesheets/personalized-responsive.css'
%}
    <link rel="stylesheet" type="text/css" href="{{ asset_url }}">

{% endstylesheets %}

我将我的 css 中的资产路径更改为:

background-image: url('/bundles/visualimmersionsite/images/bg-header-1.jpg');

它有效!

但我的问题是:现在它可以在 dev env 上运行,好的,很好。但是这种方法在我通过生产环境时确实会带来问题吗?

【讨论】:

    猜你喜欢
    • 2020-07-30
    • 2020-04-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-27
    • 2018-06-06
    • 2014-12-30
    • 1970-01-01
    相关资源
    最近更新 更多