twitter-bootstrap-3 - Yeoman 与 Bootstrap 3

Question

我是 Yeoman 新手。我想使用 Bootstrap3，我想使用在线生成器对其进行自定义，以将默认样式更改为我的应用程序样式。

由于 Yeoman 处理所有依赖项，我如何进行这些更改并将其添加到 Web 应用程序中？

Answer 1

如果您使用生成器，您将获得编译后的 css 文件。这些文件只能通过在您的项目中硬编码来集成(在大多数情况下是您的 index.html)。我不建议走这条路。生成器提供的所有 css 配置参数也是可以更改的 sass 变量。您可以在自己的项目中使用这些变量，如下所示:

通过 Bower 安装 sass-bootstrap

bower install sass-bootstrap 

在 main.css 中，您必须包含 bootstrap.scss 文件:

@import 'sass-bootstrap/lib/bootstrap';

在此包含语句之前，您可以更改引导生成器提供的所有变量 - 例如更改您必须编写的背景颜色

$body-bg: eee;

您可以使用生成器提供的所有变量来执行此操作。只需将 @ 替换为 $ 符号即可。

当然，您的 Gruntfiles.js 中需要一个 compass 目标。如果您在配置 gruntfile 时遇到问题，请查看 https://npmjs.org/package/generator-bootstrap 。使用此生成器，您可以创建一个示例项目来获取所需的配置。