将Bootstrap模板添加到MeteorJS [英] Add Bootstrap template to MeteorJS
问题描述
我有一个想在MeteorJS应用程序中使用的来自 https://wrapbootstrap.com/的Bootstrap主题.问题在于它具有脚本标记，例如:
I have a Bootstrap theme from https://wrapbootstrap.com/ that I want to use in my MeteorJS application. The issue is it has script tags like:
<!--[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?
which don't work when added to MeteorJS. I know tags don't work, but how would you acoomodate this designed page to 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外部可以正常工作.
I added the script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script> above. All the above scripts are added in the <body>. The google.maps library is used in lib/main.js and it doesn't work with MeteorJS because it raises ReferenceError. Outside of Meteor it works fine.
关于如何从Bootstrap模板添加Google Maps脚本的任何想法?
Any ideas on how to add that Google Maps script from the Bootstrap Template?
以后的修改:
Bootstrap模板具有一个lib/main.js文件，这是最后导入的javascript文件.不过，当我将其添加到Meteor时，它似乎已运行，但是在UI中看不到它的效果.例如，它执行此行$(".chzn-select").select2();，但是只有当我从控制台执行它时，才能看到UI更改.该文件最后由Meteor加载.我也尝试过
The Bootstrap template has a lib/main.js file which is the last javascript file imported. Nevertheless, when I add it to Meteor, it seems to be run, but its effects are not seen in UI. For example, it executes this line $(".chzn-select").select2(); but only when I execute it from the Console I can see the UI changes. This file is loaded last by Meteor. I also tried with
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;
}
没有成功.
推荐答案
这些外部主题可能与流星附带的默认引导程序不兼容，因此您应该删除流星的引导程序包:
These external themes might not be compatible with the default bootstrap included with meteor, so you should remove meteor's bootstrap package:
删除默认引导程序:
meteor remove bootstrap
添加主题:
将css文件放置在项目的css目录中，例如/client/css
Place your css files in your project's css directory, say /client/css
将主题javascript文件放置在/client/lib
Place the themes javascript files in /client/lib
不要担心脚本标记，也不必链接任何一个或任何东西，流星应该处理所有这些.
Don't worry about the script tags, or linking any of them or anything, meteor should take care of all of that.
也
Also
Meteor默认包含JQuery，因此您不必担心将其包含在项目中.如果由于某种奇怪的原因您不是流星项目而添加了jquery，请使用:
Meteor includes JQuery by default so you don't have to worry about including it in your project. To add jquery if for some odd reason you're meteor project might not have it use:
meteor add jquery
外耳道
例如FB/Google Mapis API/跟踪脚本.像往常一样将它们添加到html文件的<head>部分.
e.g FB/Google Mapis API/Tracking scripts. Add them in the <head> section of your html file as normal.
希望您发现所有这些都很酷！！
Hopefully you find all of this cool!!
这篇关于将Bootstrap模板添加到MeteorJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
