11

我想在不使用捆绑软件的情况下将 Twitter Bootstrap 与 Symfony 2 一起使用。我设法安装了 MopaBootstrapBundle，但决定将其删除并使用普通 TB。

设置

作曲家.json

"require": {
    "twbs/bootstrap": "dev-master"
}

因此，使用 composer 安装后，路径[project_path]/vendor/twbs/bootstrap与：https ://github.com/twbs/bootstrap 相同

配置.yml

# Assetic Configuration
assetic:
    debug:          %kernel.debug%
    use_controller: false
    bundles:        [ ]
    filters:
        cssrewrite: ~
        less:
            node: /usr/bin/nodejs 
            node_paths: [/usr/lib/nodejs:/usr/lib/node_modules]
            apply_to: "\.less$"

我为我的项目创建了一个新包AcmeDemoBundle并添加了[project_path]/src/Acme/DemoBundle/Resources/public/less包含两个文件的文件夹：

  • variables.less[project_path]/vendor/twbs/bootstrap/less/variables.less-我可以在不影响原始 TB 包的情况下修改的副本
  • style.less

style.less 内容：

@import "../../../../../../vendor/twbs/bootstrap/less/bootstrap.less";
@import "variables.less";

// any local changes should go below this line
[some local less code]

在base.html.twig

{% stylesheets '@AcmeDemoBundle/Resources/public/less/style.less' %}
    <link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}

问题

一切正常，直到我想使用 Twitter Bootstrap 中包含的 Glyphicons。

<span class="glyphicon glyphicon-search"></span>

Glyphicons 使用字体来表示图标，位于 Twitter Bootstrap 中：https://github.com/twbs/bootstrap/tree/master/fonts

为了使用它们，我必须创建以下符号链接。

[project_path]/web/fonts -> [project_path]/vendor/twbs/bootstrap/fonts/

在prod环境中，一切看起来都很棒（除了字体显示有点脆），但在环境中，由于文件位置dev的存在，字体不会加载。/app_dev.php/所以我在浏览器的控制台中得到这个错误：

GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.woff 404 (Not Found) cmmp.localdev/app_dev.php/:1
GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.ttf 404 (Not Found) /app_dev.php/fonts/glyphicons-halflings-regular.ttf:1
GET http://cmmp.localdev/app_dev.php/fonts/glyphicons-halflings-regular.svg 404 (Not Found) /app_dev.php/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular:1

使用cssrewrite过滤器只会将控制台中的错误更改为dev：

GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.woff 404 (Not Found) cmmp.localdev/:75
GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.ttf 404 (Not Found) cmmp.localdev/:75
GET http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.svg 404 (Not Found) cmmp.localdev/app_dev.php/:75

问题

我已经苦苦挣扎了几天，尽管在 StackExchange 上找到了许多问题和解决方案，但我无法解决这个问题。

我错过了什么？我应该如何解决这个问题？

4

2 回答 2

9

我解决了这个非常简单的问题，现在我什至连问都感到有点羞耻。尽管如此，我相信这篇文章将帮助其他人更好地理解如何在不使用任何额外捆绑包的情况下将 Twitter Bootstrap 与 Symfony 2 一起使用：

解决方案

我不得不将 Twitter Bootstrap 的变量更改@icon-font-path为：

// original value "../fonts/"
@icon-font-path: "../../../fonts/";

所以，而不是路径：

http://cmmp.localdev/Resources/public/fonts/glyphicons-halflings-regular.woff

我已经获得：

http://cmmp.localdev/fonts/glyphicons-halflings-regular.woff

这指向上述符号链接：

[project_path]/web/fonts -> [project_path]/vendor/twbs/bootstrap/fonts/

笔记：

这仅适用于cssrewrite过滤器。

于 2013-09-19T15:42:28.070 回答
-3

可能对你有用，尽量少用 sudo 安装

http://blog.servergrove.com/2012/03/16/error-cannot-find-module-less-with-symfony2-assetic-and-twitter-bootstrap/

于 2013-09-19T06:11:58.567 回答