2012-08-14 120 views
21

我刚刚在SO上遇到了Twitter Bootstrap。我已经通过一些在线教程脱脂,如果我的理解至今是正确的,使用TB基本上包括:Symfony2和Twitter Bootstrap

  1. 下载TB,提取CSS文件等
  2. 引用所需的CSS,JS文件在您的HTML文档和使用定义的CSS模式

我想使用Twitter Bootstrap和Symfony2。鉴于我对如何使用结核病的理解,我认为与Symfony一起使用它相对容易,所以我很惊讶地发现有几个(实际上有几个)Bundle与Symfony一起使用。

所以我的问题是:

  1. 为什么一个包需要使用Twitter的引导与Symfony2的? - 我上面解释的方法会不起作用(即直接在树枝模板中添加引用)?

  2. 由于有几个Twitter的引导束可(在最近的一次统计有3个),这是最容易使用的(它必须是一个正在使用最新提交的支持,而不是一个死的项目)

回答

32

我很确定这些套餐很棒,但它们有优点和缺点。你也可以直接在你的项目中使用没有捆绑的TB。这是我亲手做的,那样:在网络

  • 混帐克隆TB /(以获得最新的更新和保持更新)
  • 我直接打电话bootstrap.less在我与Assetic树枝模板和更少的过滤器。这样,我就可以创建我自己的.less文件,这些文件包含@import TB并使用他们令人惊讶的mixin。

这种方式非常强大。再加上yui-compressor,当我在无调试模式下使用Assetic时,我所有的js和less文件被编译成一个.css输出和一个.js输出。并且您可以从所有TB功能中受益,无需使用.css

+0

感谢您的及时答复。你是一个拯救生命的人!我正在撕掉我的头发,去哪个方向。当你有一点时,你能否详细说明一下?使用Assetic,yui-compressor等显示树枝模板的小片段,所需的配置设置等等都非常棒,因为这对我来说是很多新技术。谢谢 – 2012-08-14 13:33:09

+3

这本食谱应该完美适合你:http://symfony.com/doc/current/cookbook/assetic/yuicompressor.html;) – guillaumepotier 2012-08-14 14:00:19

+0

+1。 – 2012-08-14 16:03:28

3

您可以使用Twitter Boostrap(TB)将css添加到项目中。然后,你有一个起点去做比从头开始更直观的事情。正如你在第一部分中所描述的那样。

但是,您还可以从处理模板与TB集成的Bundle中检索更有趣的内容。例如:

例如,用symfony 1.4(我知道SF2这个帖子谈判),你有一个插件,可以添加新的主题管理生成器有一个很好的TB集成,而不是默认的。我知道sf2中没有官方的管理生成器,但它可以用于CRUD。(除了来自核心团队的消息(FOS * Bundle,Doctrine,Propel,等)以外,其他的东西可以是真正的,因为symfony 1.0,并不是所有的bundle都很好地实现,开发,维护,测试,记录等。等等))。所以我建议你测试一下,看看它们中的一个是否适合你的需要,或者采取灵感来改进它们(它们几乎都在github上)或者建立你自己的。

而且顺便说一句,有many Bundle ..

7

有迹象表明,提供了与Twitter的引导symfony中整合2个大包:

在我看来:

MopaBootstrapBundle比较复杂,提供了自己的布局结构(的原因,你可以创建自己太)和很多定义的功能,额外的assetic,形式等一体化

BcBootstrapBundle更简单和更清晰你使用自己的布局结构,并有很多定义的功能,额外的资产,形式和其他集成太

不使用任何intergtaion捆绑也是一种选择,但你松散与形式,资产,少和整合所以(正如@Acyra在他的评论中提到的)

我更喜欢使用带有额外集成功能的BcBootstrapBundle,并使用我自己的自定义布局结构。

1

对Symfony和Bootstrap的更新: Symfony在他们的文档的细节中总是显得有点落后,所以这里是对Symfony的更新。现在版本2.6和更高版本包括与Twitter Bootstrap的基本集成。

http://symfony.com/blog/new-in-symfony-2-6-bootstrap-form-theme

希望这样可以节省别人的时间,可以得到它的工作,因为他们上面的Symfony文档中解释!

+0

但第三方包内怎么样?像Fos UserBundle – Dheeraj 2015-07-07 12:54:44

+1

根据Symfony的文档,引入Bootstrap应该像扩展主题视图一样简单,或者在这些文档中嵌入一个片段。由于Bootstrap主要是JS和CSS的库,所以任何bundle都应该能够访问这些资产。 “新形式的主题有两种形式:正常布局和水平布局要应用此新的主题,以您的应用程序的所有形式,使用以下配置: {%form_theme形式‘bootstrap_3_layout.html.twig’% } {#{%form_theme form'bootstrap_3_horizo​​ntal_layout.html.twig'}}#}“ – 2015-07-07 13:02:53