我有一个来自https://wrapbootstrap.com/的Bootstrap主题,我想在MeteorJS应用程序中使用它。问题是它有脚本标签,如:
<!--[if !lte IE 6]><!-->
<!-- Link to Google CDN's jQuery + jQueryUI; fall back to local -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery.min.js"><\/script>')</script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>window.jQuery.ui || document.write('<script src="js/libs/jquery.ui.min.js"><\/script>')</script>
script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></scrip>
<!-- RECOMMENDED: For (IE6 - IE8) CSS3 pseudo-classes and attribute selectors -->
<!--[if lt IE 9]>
<script src="js/include/selectivizr.min.js"></script>
<![endif]-->
<script src="js/libs/jquery.ui.touch-punch.min.js"></script> <!-- REQUIRED: A small hack that enables the use of touch events on mobile -->
添加到MeteorJS时不起作用。我知道标签不起作用,但是你如何将这个设计的页面添加到MeteorJS?
稍后编辑:
我在上面添加了script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
。以上所有脚本都添加在<body>
中。 google.maps
库在lib/main.js
中使用,但它不能与MeteorJS一起使用,因为它会引发ReferenceError
。在Meteor之外它运作良好。
有关如何从Bootstrap模板添加Google Maps脚本的任何想法吗?
稍后编辑:
Bootstrap模板有一个lib/main.js
文件,这是导入的最后一个javascript文件。然而,当我将它添加到Meteor时,它似乎已经运行,但它的效果在UI中看不到。例如,它执行此行$(".chzn-select").select2();
,但只有当我从控制台执行它时,我才能看到UI的变化。此文件由Meteor最后加载。我也试过
function load_scripts() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "lib/main.js";
document.body.appendChild(script);
}
if (Meteor.is_client) {
window.onload = load_scripts;
}
没有成功。
答案 0 :(得分:7)
这些外部主题可能与meteor附带的默认引导程序不兼容,因此您应该删除meteor的引导程序包:
删除默认引导程序:
meteor remove bootstrap
添加您的主题:
将您的css文件放在项目的css目录中,比如/client/css
将主题javascript文件放在/client/lib
不要担心脚本标签,或链接其中任何一个或任何东西,流星应该照顾所有这些。
同时强> 的
Meteor默认包含JQuery,因此您不必担心将其包含在项目中。添加jquery如果由于某些奇怪的原因你是流星项目可能没有使用它:
meteor add jquery
外部Apis
例如FB / Google Mapis API /跟踪脚本。正常地将它们添加到html文件的<head>
部分。
希望你能找到所有这些酷!!