Twitter引导程序glyphicons字体';在Symfony2上的prod中使用assetic时找不到


Twitter Bootstrap glyphicons font's not found when using assetic in prod on Symfony2

我读了很多关于这方面的文章,但无法将其用于我的项目。

因此,基本上我有一个Symfony2项目,其中包括twitter引导程序(v3)。在开发模式下,一切都很好,但当我在生产模式下尝试时,我发现错误,说找不到twitter引导程序字体:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/Symfony/css/fonts/glyphicons-halflings-regular.woff   
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/Symfony/css/fonts/glyphicons-halflings-regular.ttf  
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/Symfony/css/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular

这很正常,因为我在Symfony/中没有css/文件夹

以下是项目的结构:

app/
src/
vendor/
web/
   css/
      compiled/
   fonts/
   js/

树枝文件:

{% block stylesheets %}
    {% stylesheets output="css/compiled/main.css" filter='cssrewrite'
        'css/bootstrap.min.css'
        'css/general.css'
        'css/navigation.css'
    %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

我用过:

php app/console assetic:dump --env=prod

我已经签入了bootstrap.min.css(在web/css/computered中)文件(prod和dev),它们都有相同的字体路径。类似于(../../fonts/fontName.ext).

如果我们看一下路径,它既不应该在dev模式下也不应该在prod模式下工作,因为该路径将字体/文件放在web目录之外。然而,它在开发模式下工作。

你知道如何解决这个问题吗?

我会很棒的。

如果使用"cssrewrite"过滤器,它会按照Maxoo已经说过的方式重写字体文件的路径(到其原始源)。

您可以通过以下方式为字体文件添加资产路径(这样它们就会被复制到css/fonts/文件夹中,css文件就会使用原始的../fonts/路径找到它们)

我使用了以下解决方案:

config.yml:

assetic:
    debug:          %kernel.debug%
    use_controller: false
    assets:
        bootstrap_fonts_woff:
            inputs:
                - 'original/path/to/bootstrap/fonts/glyphicons-halflings-regular.woff'
            output: fonts/glyphicons-halflings-regular.woff
        bootstrap_fonts_ttf:            
            inputs:
                - 'original/path/to/bootstrap/fonts/glyphicons-halflings-regular.ttf'
            output: fonts/glyphicons-halflings-regular.ttf
        bootstrap_fonts_svg:
            inputs:
                - 'original/path/to/bootstrap/fonts/glyphicons-halflings-regular.svg'
            output: fonts/glyphicons-halflings-regular.svg
        bootstrap_fonts_eot:
            inputs:
                - 'original/path/to/bootstrap/fonts/glyphicons-halflings-regular.eot'
            output: fonts/glyphicons-halflings-regular.eot

然后呼叫

php app/console assetic:dump --env=prod

它应该将文件导出到web文件夹中的字体目录中。

希望这能有所帮助!

您不必在Symfony/路径下搜索它们,事实上Symfony2网络文件夹是web/,因此url是"相对";到web/文件夹。

顺便说一句,你必须使用以下命令

php app/console assets:install

如果你喜欢符号链接,你也可以将--symlink参数添加到你的命令中

那么assets:install和assetics:dump之间有什么区别呢

CCD_ 7将把所需资源符号链接或复制到"0";公共网络文件夹";

assetic:dump将仅将所有js组合为一个

正确的解决方案:

  • 安装Nodejs,设置symfony2配置文件,它会自动将您选择的cssrewrite过滤器编译成CSS。这将解决这些错误。

  • 我的config.yml和config_dev.yml看起来像这只是一个资产部分-非常小心路径语法,否则你会得到这个错误"运行时发生错误:…错误:找不到模块'less'"许多人都遇到了这3个错误消息,用谷歌搜索这个字符串来找出"运行时出现错误:错误:找找到模块'less'"

资产:

debug: '%kernel.debug%'
use_controller:
       enabled: '%kernel.debug%'
       profiler: true
filters:
    cssrewrite: ~
    ###is for linux path i am on windows for dev and linux for prod
    less:
        ###node: /usr/bin/nodejs
        ###node_paths: [/usr/lib/nodejs]
        node: "C:''Program Files (x86)''nodejs''node.exe"
        node_paths: ["C:''Users''John''AppData''Roaming''npm''node_modules"]
        apply_to: "'.less$"
  • 不要忘记安装"npm安装-g少"

  • 在我的特定情况下:当执行"php-app/console-assetic:dump"时,我会得到同样的错误。这是因为我的Windows开发web服务器是这样设置的:web根目录是"C:''xamplep''htdocs''",项目是这样的"C:''xampp''htdocs''phantom''",assetic:dump将glyphicons-harlings-regular.ttf、glyphicos-harlings-cregular.woff和glyphicons-harlings-regular.woff2放在"C:''xamp ''htdocs ''phantom''web''fonts"中,但是,当加载页面时,它会显示在http://localhost/"正如你所看到的,这是我的开发设置的问题。所以我将文件夹字体"C:''xamplep''htdocs''phantom''web''fonts"复制到web根目录"C:''xamp''htdocs"这就解决了问题。

  • 在服务器web根目录为"C:''examplep''htdocs''phantom''web''"的生产环境中不会发生这种情况。我在生产服务器上进行了测试,无需手动将字体文件夹复制到webroot。

  • 此外,当在项目目录"php-app/console assetic:dump"中运行相同的命令时,您会收到类似"FileError:'../bootstrap/less/bootstrap.less'未找到。尝试过../bootstrap/less/boottrap.less,C:''examplep''htdocs''phantom''vendor''mopa''BootstrapBundle''mopa''bundle''BootstrapBundle''Resources''public''bootstrap"的错误"php app/console assets:install"在"C:''xamplep''htdocs''phantos''web''bootstrap"中,这不是正确的webroot目录,所以为了再次解决开发中的这个临时问题,我只会将目录"C:''xampp''htdocs''phanto''web''boottrap"复制到"C:''xamp ''htdocs ''bootstration"中,以解决问题。再次运行您的命令,它将很好地、干净地编译为css。

您可能应该尝试保持Bootstrap文件夹结构不变(例如,使用bower下载)。顺便说一句,cssrewrite过滤器将解析你的css文件,以反映字体的位置。