Question

我正在尝试建立一个我在共享主机上工作的网站，所有工作都很好但是自Symfony以后的FontAwesome图标找不到它们应该在哪里。我按照以下步骤将网站移至生产共享托管：

将资源发布为硬拷贝，因为SH不允许使用符号链接，因此我运行此命令assets:install
通过运行以下命令发布Assetic处理的资产：assetic:dump（dev）和assetic:dump --env=prod（prod）

但由于我一直在Firebug上收到此错误，因此无法正常工作：

"NetworkError: 404 Not Found - http://tanane.com/bundles/backend/img/mybg.png"
"NetworkError: 404 Not Found - http://tanane.com/bundles/backend/fonts/fontawesome-webfont.woff?v=4.1.0"
"NetworkError: 404 Not Found - http://tanane.com/bundles/backend/fonts/fontawesome-webfont.ttf?v=4.1.0"

在localhost，按照相同的步骤，一切正常，所以我不知道是否是权限问题或其他问题。

这就是我在base.html.twig定义资产的方式：

  {% block stylesheets %}
      {% stylesheets
              'bundles/template/css/bootstrap.min.css'
              'bundles/template/css/bootstrap-theme.min.css'
              'bundles/template/css/font-awesome.min.css'
              'bundles/template/css/select2.css'
              'bundles/template/css/select2-bootstrap.css'
              'bundles/template/css/bootstrapValidator.min.css'
              'bundles/template/css/datepicker.css'
              'bundles/template/css/datepicker3.css'
              'bundles/template/css/tanane.css'
         filter='cssrewrite'
      %}
      <link rel="stylesheet" href="{{ asset_url }}" />
     {% endstylesheets %}
  {% endblock %}

我做了一个研究并发现了很多关于这个问题的主题，例如this one我也发现了this interesting one，但我对第二个问题有疑问。

有人能给我一个帮助吗？我被困了

已安装的SpBowerBundle + FkrCssURLRewriteBundle

我已经安装并配置了两个软件包，但即使在此之后我仍然遇到图像问题，只需在Select2库中。

这是bower.json文件内容：

{
    "name": "TemplateBundle",
    "dependencies": {
        "bootstrap": "latest",
        "bootstrap-datepicker": "latest",
        "bootstrap-growl": "latest",
        "bootstrapvalidator": "latest",
        "jquery": "1.11.*",
        "jquery-migrate": "latest",
        "pwstrength-bootstrap": "latest",
        "select2": "latest",
        "font-awesome": "latest"
    }
}

这就是我在/app/config/config.yml

中添加的内容

#FkrCssURLRewriteBundle 
fkr_css_url_rewrite:
    rewrite_only_if_file_exists: true
    clear_urls: true

# SpBowerBundle
sp_bower:
    install_on_warmup: true
    allow_root: true
    assetic:
        enabled: true
        nest_dependencies: false
        filters:
            packages:
                bootstrap:
                    css:
                        - css_url_rewrite
                font_awesome:
                    css:
                        - css_url_rewrite
    bundles:
        TemplateBundle: ~

这是我现在得到的错误：

"NetworkError: 404 Not Found - http://tanane.dev/select2.png"
"NetworkError: 404 Not Found - http://tanane.dev/select2-spinner.gif"

为什么？

SpBowerBundle中的已禁用资产

我在/app/config/config.yml的SpBowerBundle中禁用了资产：

# SpBowerBundle
sp_bower:
    install_on_warmup: true
    allow_root: true
    bundles:
        TemplateBundle: ~

由于我使用assetic和SpBowerBundle来处理库依赖关系，所以我在base.html.twig重写了CSS / JS块，如下所示：

{% stylesheets
    'bundles/template/components/bootstrap/dist/css/bootstrap.min.css'
    'bundles/template/components/bootstrap/dist/css/bootstrap-theme.min.css'
    'bundles/template/components/font-awesome/css/font-awesome.min.css'
    'bundles/template/components/select2/select2.css'
    'bundles/template/css/select2-bootstrap.css'
    'bundles/template/components/bootstrapvalidator/dist/css/bootstrapValidator.min.css'
    'bundles/template/components/bootstrap-datepicker/css/datepicker.css'
    'bundles/template/components/bootstrap-datepicker/css/datepicker3.css'
    'bundles/template/css/tanane.css'
   filter='css_url_rewrite'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

然后我清除缓存并运行命令assets:install --symlink，assetic:dump和assetic:dump --env=prod，仍然没有看到图像和FontAwesome字体：

Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/css/select2.png
Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/css/select2-spinner.gif
Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/css/select2.png
Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/fonts/fontawesome-webfont.woff?v=4.2.0
Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/fonts/fontawesome-webfont.ttf?v=4.2.0
Failed to load resource: the server responded with a status of 404 (Not Found) http://tanane.dev/app_dev.php/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular

我想念别的吗？为了解决这个烦人的问题，我还能做些什么？

修正禁用方式

我修复了我在SpBowerBundle配置中犯的一些错误，现在我有了这个错误：

sp_bower:
    install_on_warmup: true
    allow_root: true
    assetic:
        enabled: false
        nest_dependencies: false
    bundles:
        TemplateBundle: ~

但由SpBowerBundle管理的图片仍未显示，请参阅附件图片：

enter image description here

我的assetic已启用config.yml：

assetic:
    debug:          "%kernel.debug%"
    use_controller: false
    bundles:
      - FrontendBundle
      - BackendBundle
      - ProductBundle
      - CommonBundle
      - UserBundle
      - TemplateBundle

我应该禁用它并从那里删除所有这些包吗？

另一项测试

按照@lenybenard的建议我做了这个：

    {% block stylesheets %}
        {% stylesheets filter='css_url_rewrite'
            'bundles/template/components/font-awesome/css/font-awesome.min.css'
            'bundles/template/components/bootstrap/dist/css/bootstrap.min.css'
            'bundles/template/components/bootstrap/dist/css/bootstrap-theme.min.css'
           filter='cssrewrite'
        %}
        <link rel="stylesheet" href="{{ asset_url }}" />
        {% endstylesheets %}

        {% stylesheets
            'bundles/template/components/select2/select2.css'
            'bundles/template/css/select2-bootstrap.css'
            'bundles/template/components/bootstrapvalidator/dist/css/bootstrapValidator.min.css'
            'bundles/template/components/bootstrap-datepicker/css/datepicker.css'
            'bundles/template/components/bootstrap-datepicker/css/datepicker3.css'
            'bundles/template/css/tanane.css'
           filter='cssrewrite'
           filter='css_url_rewrite'
        %}
        <link rel="stylesheet" href="{{ asset_url }}" />
        {% endstylesheets %}
    {% endblock %}

再次重复相同的过程：

清除缓存cache:clear & cache:warmup以及rm -rf /var/cache & rm -rf /var/logs以防万一
来自Symofony2 shell：assets:install --symlink & assetic:dump & assetic:dump --env=prod

结果：在DEV中一切正常，在PROD中都是错误的

Answer 1

这是资产中一个相当不幸的错误的结果。有关详细信息，请参阅this github说明。

我已解决的解决方案是使用https://github.com/fkrauthan/FkrCssURLRewriteBundle

这是我尝试的许多方法中唯一适用于每种情况的方法。

Answer 2

我遇到同样的问题，这是有效的

我使用https://github.com/fkrauthan/FkrCssURLRewriteBundle然后在＃app / config / config.yml中添加此

font-awesome-otf:
        inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/FontAwesome.otf'
        output: 'fonts/FontAwesome.otf'
font-awesome-eot:
        inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.eot'
        output: 'fonts/fontawesome-webfont.eot'
font-awesome-svg:
        inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.svg'
        output: 'fonts/fontawesome-webfont.svg'
font-awesome-ttf:
        inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.ttf'
        output: 'fonts/fontawesome-webfont.ttf'
font-awesome-woff:
        inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.woff'
        output: 'fonts/fontawesome-webfont.woff'

我要感谢：http://www.maraumax.fr

Answer 3

实际上，这是非常符合逻辑的，在开发环境中，它的工作原理是因为资产创建了有资源的文件。

但是当您处于生产模式时，每个资产块都会通过连接所有资源文件来编译一个文件中的所有资源。

问题是在css中，@ import必须位于文件的顶部...而在这里，在prod中，你的字体很棒的导入是在文件中，并且浏览器无法读取。

要解决您的问题，您可以这样做：

首先使用@import导入样式表：

{% stylesheets filter='css_url_rewrite'
    'bundles/template/components/font-awesome/css/font-awesome.min.css'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

然后，导入其余的

{% stylesheets
    'bundles/template/components/bootstrap/dist/css/bootstrap.min.css'
    'bundles/template/components/bootstrap/dist/css/bootstrap-theme.min.css'
    'bundles/template/components/select2/select2.css'
    'bundles/template/css/select2-bootstrap.css'
    'bundles/template/components/bootstrapvalidator/dist/css/bootstrapValidator.min.css'
    'bundles/template/components/bootstrap-datepicker/css/datepicker.css'
    'bundles/template/components/bootstrap-datepicker/css/datepicker3.css'
    'bundles/template/css/tanane.css'
   filter='css_url_rewrite'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

Answer 4

我已经处理了一段时间并想出了一个新的解决方案。改善@ lenybernard的答案，这是我的解决方案：

由于@import不在font-awesome-min.css文件中，因此对我的案例不起作用。我正在使用一个主题，发现与主题相关的样式表有导入注释。此外，主题要求在其自己的CSS文件之前加载Bootstrap，因此将theme.css文件移动到列表顶部，或者如上一个答案中提到的那样将其分离，完全破坏了主题。因此，最终的解决方案是找到带有@import标记的行，并将其放在资产列表中第一个文件的第一行，并将其从引用的文件中删除。例如：

'bundles/foo/bootstrap.css'
'bundles/foo/custom_theme.css' <- if your @import is here
'bundles/foo/font-awesome.css'

...

'bundles/foo/bootstrap.css' <- put it here
'bundles/foo/custom_theme.css' <- and remove it from this one
'bundles/foo/font-awesome.css'

另一个解决方案是创建一个新的CSS文件，并根据需要为其命名，将@import行放在此文件上，并将此文件放在列表的顶部。例如：

'bundles/foo/font-awesome-fix.css' <- put @import here
'bundles/foo/bootstrap.css'
'bundles/foo/custom_theme.css' <- and remove it from this one
'bundles/foo/font-awesome.css'

Answer 5

我在尝试使用带有Ez Publish设置的字体时遇到了类似的问题。字体正确地位于web / font /目录中，并且.less被正确编译为指向该目录。然而，我在尝试拉取字体文件时遇到了404错误。

问题原来是错误配置的虚拟主机。配置文件有这一行：

RewriteRule ^ /（css | js）/.* \。（css | js） - [L]

只要扩展名为.js或.css＆＃39;，就会有效地说明来自css或js文件夹的任何文件。我不得不将其修改为

RewriteRule ^ /（css | js | font）/.* \ .w * - [L]

允许使用字体文件夹和任何扩展名。没有这个Symfony和Ez Publish就试图将网址路由到动态内容。

资产后，Fontawesome字体失败：install和assetic：dump

5 个答案: