11

我有一个来自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 模板有一个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;
}

没有成功。

4

1 回答 1

7

这些外部主题可能与流星包含的默认引导程序不兼容,因此您应该删除流星的引导程序包:

删除默认引导程序

meteor remove bootstrap

添加您的主题:

将您的 css 文件放在项目的 css 目录中,例如/client/css

将主题 javascript 文件放入/client/lib

不要担心脚本标签,或者链接它们中的任何一个或任何东西,meteor 应该处理所有这些。

Meteor 默认包含 JQuery,因此您不必担心将其包含在您的项目中。如果由于某些奇怪的原因您是流星项目,则添加 jquery 可能没有使用它:

meteor add jquery

外部 API

例如 FB/Google Mapis API/跟踪脚本。像往常一样将它们添加到<head>html 文件的部分中。

希望你觉得这一切都很酷!!

于 2013-03-03T10:04:16.143 回答