Bootstrap 4定制构建生成器/下载

Question

有人知道是否有一个 alpha/beta Bootstrap 4 的定制生成器吗？类似于Bootstrap 3上自定义和下载所提供的那个。

https://getbootstrap.com/docs/4.0/customize/目前仍无法使用

- Yatko

---

这是我所知道的唯一适用于Bootstrap 4的工具：http://upgrade-bootstrap.bootply.com/bootstrap-4-customizer - Carol Skelly

还有一个完整的Bootstrap 4自定义构建工具。 - Carol Skelly

Answer 1

正如在Stack Overflow上讨论的那样，Bootstrap 4将不会有一个自定义器。这意味着您将不得不手动构建Sass文件。例如，可以使用sass npm软件包来实现。

我还创建了一个工具来处理编译Sass和供应商前缀，我一直在用它来编译Bootstrap。以下是一个简单的设置，可以帮助您入门：

npm i bootstrap@4 sass-plus -D

创建一个名为app.scss的文件，并在其中导入Bootstrap：

@import "bootstrap/scss/bootstrap";

编译它：

npx sass-plus -i app.scss -o compiled.css

现在你应该能在compiled.css中找到所有的Bootstrap类。您可以更改app.scss文件并重新编译，更改将反映在CSS中，可以在HTML中正常引用。

通过单独导入Bootstrap组件并更改Bootstrap变量，您可以更改网站的外观和编译CSS的大小。

资源：

• 单独导入所有Bootstrap组件
• sass-plus文档

- Klooven

Answer 2

看起来Bootstrap团队不会像v3那样提供自定义工具。

如其他答案所述，bootstrap.build存在，并且具有非常好的用户界面，并提供对大多数变量和选项的访问。不幸的是，它似乎没有快速更新Bootstrap团队发布更新的速度。

upgrade-bootstrap.bootply.com是另一个选择，但没有指示使用哪个v4版本。它只能访问有限的变量和选项。

bootstrapcustomizer.compoutpost.com提供对所有变量和选项的完全访问，并与v4版本保持最新状态。它的用户界面不如bootstrap.build，但仍然可用。

（披露：我创建了bootstrapcustomizer.compoutpost.com）

- johna

Answer 3

很好的问题！ Bootstrap 3有一个自定义页面，正如您所指出的那样。您可以使用此构建工具：https://bootstrap.build/。我不确定它是否是BS3自定义页面的替代品还是全新的东西。看起来像一个不错的编辑器。或者您可以使用SASS构建自定义版本的Bootstrap 4。此链接提供有关制作主题的更多信息：https://getbootstrap.com/docs/4.0/getting-started/theming/。

- Jess

---

这不是同一件事。版本3的自定义程序允许您挑选和选择要包括哪些组件，而不仅仅是对整个主题进行修改。 - AaronF

仅供参考，我的团队正在使用SASS，并在Visual Studio中使用Web Compiler将SASS构建为CSS文件。效果很好。这使您可以相当轻松地创建自己的BS组件，甚至使用“变体”，如*-primary、*-success、*-info等。 - Jess

是的，我刚刚介绍了Bootstrap，它破坏了一个复杂的电子表格组件，因此对于那个页面，我只想要Bootstrap按钮，因为我真的不理解Bootstrap，也不知道如何编译自己的版本。 - Paul Taylor

@PaulTaylor 你不需要自定义构建来实现。只需按需使用CSS即可。 - Jess

我该如何正确地提取它们呢？ - Paul Taylor

这里是 https://jsfiddle.net/pydLyu4g/。下次您应该点击“提问”，这样评论区就不会被与问题无关的内容填满了。祝您有愉快的一天！ - Jess