Question

我继续学习Meteor，它慢慢走到了一起，我正在构建远离教程的东西。我想包括一些额外的非功能JS动画等，并决定格林索克，因为我熟悉它。我已经在我的main.html主体中将CDN包含在TweenMax中，并且已经从模板助手中调用它。

main.html中：

<head>
<title>NO-TEA-FY</title>    
<link rel="stylesheet" href="css/noteafy.css" id="stylesheet">

模板：

<template name="mainInit">
<div class="teaContainer">
    <h1 class="superJumboHeader">Tea</h1>
</div>

模板助手：

$(document).ready(function(){
    // If the user doesn't click on Tea within 3 seconds of arriving, shake the word
    setTimeout(function () {
        var teaCont = $(".teaContainer");
        TweenMax.to(teaCont, 1, {css:{"margin-top":"25%"}, ease:Power3.easeOut});
    }, 3000);
});

Jquery正常运行但我得到了：

未捕获的ReferenceError：未定义TweenMax。

我想知道为什么找不到TweenMax但是JQuery可以吗？

感谢。

Answer 1

如果您希望Meteor应用程序可以使用其他库，则需要将其添加为包。在这种情况下，GreenSock包看起来可以通过Atmosphere获得：

Gsap package

您需要通过以下命令行将其添加到项目中：

mrt add gsap

应该提取main.html中的CDN（它不会起作用）。

jquery开箱即用的原因是它已经作为标准软件包添加到您的应用程序中。

您可以在Meteor的包装系统>here<上阅读更多内容，并在Atmosphere上探索其他套餐。

Answer 2

我已尝试在GSAP论坛上回答：http://forums.greensock.com/topic/9575-using-greensock-with-meteor/#entry38773

为了能够从CDN加载GSAP，您需要安装名为External File Loader的Meteor插件。

使用：

mrt add external-file-loader

安装插件。

以下是您需要的方法：方法 loadJs（url，callback，timeoutDelay） - 从url加载外部JS。加载url后调用回调。 TimeoutDelay是超时前的延迟，以ms为单位。 Callback和timeoutDelay是可选的。该方法返回一个jQuery承诺。如果您使用的是Iron路由器，最好在waitOn（）函数上加载外部脚本，以确保在页面加载之前加载它们。如果您不使用Iron-Router，则可以在Template.created（）回调中使用外部文件加载器加载GSAP CDN。

Template.Templatename.created = function() {
Meteor.Loader.loadJs("//cdnUrl");
}

您也可以加载多个脚本。我个人为我使用的流星创建了一个本地GSAP插件。那是因为我有一个优质的Greensock会员资格。我会看看我是否可以在Github上提供免费版本的GSAP插件。

我希望它有所帮助，

Praney：）

使用Greensock和Meteor

2 个答案: