Javascript 滚动魔术；Requirejs错误_Javascript_Jquery_Requirejs_Scrollmagic

Javascript 滚动魔术；Requirejs错误

javascript jquery requirejs

Javascript 滚动魔术；Requirejs错误,javascript,jquery,requirejs,scrollmagic,Javascript,Jquery,Requirejs,Scrollmagic,我需要在我的项目中添加scrollmagic.js和requirejs 我的结构文件是 /js /app main.js /lib debug.addIndicators.js jquery.js require.js ScrollMagic.js app.js <head> <script data-main="js/app" src="js/lib/require.js"><

我需要在我的项目中添加scrollmagic.js和requirejs

我的结构文件是

/js
   /app
      main.js
   /lib
      debug.addIndicators.js
      jquery.js
      require.js
      ScrollMagic.js
   app.js

<head>
    <script data-main="js/app" src="js/lib/require.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="app" src="js/app.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="jquery" src="js/lib/jquery.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="app/main" src="js/lib/../app/main.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="ScrollMagic" src="js/lib/ScrollMagic.js"></script>
</head>

我的app.js是

requirejs.config({
    "baseUrl": "js/lib",
    "paths": {
        "app": "../app"

    },

});

requirejs(["jquery"]);
requirejs(["app/main"]);
requirejs(["ScrollMagic"]);
requirejs(["debug.addIndicators"]);

define(['jquery'], function() {
jQuery(document).ready(function($) {

    jQuery(function() { // wait for document ready
        // init controller
        var controller = new ScrollMagic.Controller({ loglevel: 3 });

        // build scene
        var scene = new ScrollMagic.Scene({ triggerElement: "#trigger", duration: 300, loglevel: 3 })
            .setPin("#target")
            .addIndicators() // add indicators (requires plugin)
            .addTo(controller);

    });
});


});

main.js:6 Uncaught ReferenceError: ScrollMagic is not defined
    at HTMLDocument.<anonymous> (main.js:6)
    at j (jquery.js:2)
    at Object.fireWith [as resolveWith] (jquery.js:2)
    at ready (jquery.js:2)

头脚本加载中

/js
   /app
      main.js
   /lib
      debug.addIndicators.js
      jquery.js
      require.js
      ScrollMagic.js
   app.js

<head>
    <script data-main="js/app" src="js/lib/require.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="app" src="js/app.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="jquery" src="js/lib/jquery.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="app/main" src="js/lib/../app/main.js"></script>
    <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="ScrollMagic" src="js/lib/ScrollMagic.js"></script>
</head>

进入inspector后，我出现此错误，ScrollMagic不起作用

requirejs.config({
    "baseUrl": "js/lib",
    "paths": {
        "app": "../app"

    },

});

requirejs(["jquery"]);
requirejs(["app/main"]);
requirejs(["ScrollMagic"]);
requirejs(["debug.addIndicators"]);

define(['jquery'], function() {
jQuery(document).ready(function($) {

    jQuery(function() { // wait for document ready
        // init controller
        var controller = new ScrollMagic.Controller({ loglevel: 3 });

        // build scene
        var scene = new ScrollMagic.Scene({ triggerElement: "#trigger", duration: 300, loglevel: 3 })
            .setPin("#target")
            .addIndicators() // add indicators (requires plugin)
            .addTo(controller);

    });
});


});

main.js:6 Uncaught ReferenceError: ScrollMagic is not defined
    at HTMLDocument.<anonymous> (main.js:6)
    at j (jquery.js:2)
    at Object.fireWith [as resolveWith] (jquery.js:2)
    at ready (jquery.js:2)

inspector中出现同样的错误

您必须在main.js中导入ScrollMagic，如下所示：

define(['jquery', '/path/scrollmagic'], function(jQuery, ScrollMagic) {
   ....
   ....
});