README

此项目的目标是实现Bootstrap前端框架的所有组件，作为Symfony UX Twig组件，在包含所有推荐属性（例如role或aria-）的同时减少代码量。

为什么这个项目被归档了？

TL;DR：这没有意义。写得不会更短，也不会更简单或更美观。根据需要创建自己的组件。

当我开始这个项目时，我刚刚了解了新的Symfony UX Twig组件。同时，我必须使用Bootstrap原型设计许多Web项目，并且对必须编写的标记量感到厌烦，特别是对于像轮播图或模态框这样的大组件。

然后我想：为什么不把每个Bootstrap组件也变成一个Twig组件呢。这看起来很合理。Bootstrap已经结构化为组件。由于我在几乎所有项目中都需要Bootstrap，所以我开始了这个捆绑包。

我的目标是减少要编写的标记量，使代码更容易阅读，并将Bootstrap的所有功能捆绑到新的Twig组件中，同时不失去Bootstrap提供的灵活性。

但我很快意识到：这实际上并不像我之前想象的那么简单。

让我们以简单的组件为例，比如警告或徽章。警告注定是组件，但实际上，编写警告没有真正的益处，

<twig:bs:alert type="primary" message="Hello World!" />

只需使用纯HTML即可

<div class="alert alert-primary" role="alert">Hello World!</div>

对于徽章和其他小组件也是如此。组件的标记和功能越少，实现起来越容易，但也可以更简单地使用纯HTML。为它们创建组件真的没有太多价值——这仅仅又是一种编写方式。

但对于更大的组件，如卡片、轮播图、手风琴、模态框等，情况就不同了。确实，Twig可以生成这些组件正常工作所需的所有标记，但同时，它们有更多的使用可能性，并且要使一个Twig组件能够相应地支持所有这些变体要困难得多。

以卡片为例。你可以有一个只有主体的简单卡片

<div class="card">
    <div class="card-body">
        ...
    </div>
</div>

或带有图像

<div class="card"
    <img class="card-img-top" ...>
    <div class="card-body">
        ...
    </div>
</div>

这张图片可以是顶部、底部或背景。还有标题和页脚。应该使用哪个HTML元素？头部是一个div，一个h2还是一个h3？而且，如果我想给任何内部元素添加额外的类，比如图片、主体或页脚怎么办？

考虑到所有这些可能性，创建一个能够支持所有功能、简单且标记量少于原始HTML的组件真的很困难。

话虽如此，我决定停止这个项目的开发。对我来说创建一个包含所有Bootstrap组件并支持所有这些功能的捆绑包没有意义。

但如果你在这个项目中找到了有用的资源，请随意分支或克隆。

我仍然觉得为轮播图、模态框等创建组件是个好主意。但不是作为一个捆绑包，而是根据每个项目需要的功能和标记来创建。