如何在 Meteor 中使用引导程序？答案

【问题标题】：How to use bootstrap in Meteor?如何在 Meteor 中使用引导程序？
【发布时间】：2014-12-29 22:50:51
【问题描述】：

我正在尝试在流星 1.0 中使用引导程序。我使用以下命令在流星中添加引导程序包：“meteor add bootstrap”。但它不能正确地为我工作。

我需要一排两列。这是我的html：

    <head>
    <meta charset="utf-8">
    <title>Аггрегатор новостей</title>
</head>

<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-6">.col-md-6</div>
        <div class="col-md-6">.col-md-6</div>
    </div>
</div>
</body>

但我看到两行宽度为 100%。其中容器或容器流体工作，我看到这是一个屏幕。问题是什么？我需要在标题中链接 bootstrap.css 吗？但是 Meteor 会自动执行此操作，恕我直言。

谢谢。

【问题讨论】：

对于 Meteor 1.3+ 检查这个解决方案：stackoverflow.com/a/37333520/276311

标签： twitter-bootstrap meteor

【解决方案1】：

您是否尝试过其他软件包？例如：https://atmospherejs.com/mizzao/bootstrap-3

我认为 Meteor 已经放弃了核心 Bootstrap 包。

【讨论】：

不用担心——现在有对 Meteor 的官方 Bootstrap 支持！（见我的回答）

【解决方案2】：

通过使用meteor add bootstrap，您实际上是在添加不知道col-md-x 类的Bootstrap 2.3。要么切换到使用 meteor add twbs:bootstrap 的 Bootstrap 3，这将安装官方 Bootstrap 框架 (v3)，要么将您的代码调整为

<div class="span6">span4</div>

就个人而言，我更喜欢使用 Bootstrap 3 而不是 Meteor 内核附带的核心引导程序包。另外，MDG提供的boostrap包是marked as deprecated。

【讨论】：

是的，这对我有用！谢谢你。我不明白为什么在默认情况下使用较旧的引导程序在 Meteor 中。使用 JQuery 我们有同样的情况吗？
我认为 Bootstrap 是在早期添加的，它有一种简单的方法可以让事情变得更漂亮（当时还没有 3）。由于样式不是核心功能，它继续存在，但没有优先级，MDG 不会浪费资源来维护它。 jQuery 是 1.11.0 并且稍微落后了一点。

【解决方案3】：

我建议安装官方的 Twitter Bootstrap 支持包：

meteor add twbs:bootstrap

查看他们的GitHub了解更多详情

【讨论】：

有安装这个包的指南吗？将包添加到 Meteor 似乎不会添加文件...我知道对于其他引导程序包，有一个安装过程可以第一次渲染文件。

【解决方案4】：

从提供一流 npm 支持的 Meteor 1.3 开始，推荐的方法是直接从 npm 安装 Bootstrap。

$ meteor npm install --save bootstrap

（这也将bootstrap 保存在您的package.json 文件中，以便签出您应用的其他人可以使用meteor npm install 安装它。）

然后，在任何客户端 JS 文件中（例如/client/main.js）：

import 'bootstrap';
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/css/bootstrap-theme.css';

如果您对使用 SASS/SCSS 等进行更多自定义 Bootstrap 安装感兴趣，请查看 this post。

【讨论】：