【发布时间】:2016-08-03 09:13:40
【问题描述】:
据我了解,Meteor 1.3 支持 npm 包而不是 Meteor / 大气 包。
我尝试通过meteor npm install bootstrap 将Bootstrap 添加到我的项目中。然后我添加了几个带有 row 和 col-md-3 类的 div 来测试它是否正常工作,但我没有看到我所期待的(我没有看到网格布局)。我在body 标记内创建了这些div,该标记在名为./imports/ui/body.html 的文件中声明。也许我错过了import {Bootstrap} from 'meteor/bootstrap'、import {bootstrap} from 'bootstrap'(我试过了,但没有成功)或类似的或import '../../node_modules/bootstrap/somefile'。
我尝试了meteor add twbs:bootstrap,应用程序按预期运行(col-md-3 的网格布局正确)。
This thread 推荐使用 NPM。也许我错过了一些重要的事情,以便通过 NPM 与流星 1.3 一起工作?
我的 HTML 代码没有什么特别之处(在添加流星包 twbs:bootstrap 时有效)。唯一的怪癖是 HTML 代码位于 imports/ 目录中的一个文件中,所以我可能错过了有关 loading process 的一些重要内容。
看到@loger9 和@benjaminos 的答案后进行编辑。
我做了meteor npm install --save bootstrap 并得到了一个新的 node_modules 目录。以防我再次运行npm install 和meteor,以强制在启动时执行任何进程。 body.html 和 body.js 位于imports/ui。 body.html 是
<body>
<div class="container page-wrap">
<div class="page-header">
<h1>A title</h1>
</div>
<div class="row">
<div class="col-md-3" style="background: red;">
Lorem Ipsum
</div>
<div class="col-md-3" style="background: lavenderblush;">
Lorem Ipsum
</div>
</div>
</div>
</body>
和 body.js 包括
import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';
import './body.html';
但它抱怨它找不到模块../../node_modules/bootstrap/dist/css/bootstrap.min.css(如果我 cd 到 imports/ui 目录并从那里我 cat ../../node_modules/bootstrap/dist/css/bootstrap.min.css 我查看该文件,因此该路径不正确似乎没有问题)并且不会显示任何内容。
添加import bootstrap from 'bootstrap' 似乎没有效果。 client/main.js 也可以import '../imports/ui/body.js';
我实际上知道这应该像 loger9 在他们的回答中指出的那样简单,但由于某种原因我无法让它工作。
【问题讨论】:
-
其实,如果我在/import目录下有CSS,我导入是没有问题的。似乎 /node_modules 是“我无法通过 import "..." 访问的;
-
另外,我刚刚发现并决定在this tutorial 周围玩一下,只是做
meteor npm install bootstrap4-webpack-package --save并在client/main.js 上添加import 'bootstrap4-webpack-package';让它工作。我不知道我的其他项目在哪里走错了路。
标签: twitter-bootstrap meteor npm