需要JS的一些依赖项没有找到,错误为'undefined'

Require JS some dependencies are not found and error as 'undefined'

本文关键字:错误 undefined JS 依赖 需要      更新时间:2023-09-26

我已经使用RequireJS一段时间了,但我仍然在努力掌握它…

我有一个简单的项目,有许多JS插件,根据我的理解,我通过paths对象拉这些,但有时,当我添加一个新的并运行我的脚本时,我得到一个控制台错误,解释一个依赖是undefined

这是我的JS:

require.config({
  "paths": {
    "jquery": "/content/themes/my-theme/bower_components/jquery/dist/jquery.min",
    "foundation": "/content/themes/my-theme/bower_components/foundation/js/foundation.min",
    "slick": "/content/themes/my-theme/bower_components/slick.js/slick/slick.min",
    "scrollmagic": "/content/themes/my-theme/bower_components/scrollmagic/scrollmagic/minified/ScrollMagic.min"
  },
  "shim": {
    "foundation": ["jquery"],
    "slick": ["jquery"]
  }
});
require(['jquery', "foundation", "slick", "scrollmagic"], function($) {
  /* --------------------
      Variables
  ---------------------*/
  var 
    bodyEl      = $( 'body' ),
    isOpen      = false,
    content     = $( '.content' ),
    openbtn     = $( '#open-button' ),
    closebtn    = $( '#close-button' ),
    controller  = new ScrollMagic.Controller();
  $(document).foundation();
  $(document).ready(function() {
    navInit();
    $('.main-slider').slick({
      dots: false,
      arrows: false,
      infinite: true,
      speed: 300,
      slidesToShow: 1,
      autoplay: true,
      autoplaySpeed: 4000
    });
  });
});

我有我的项目运行良好,直到我添加了最新的依赖scrollMagic…在浏览器中运行时,我得到以下错误:Uncaught TypeError: Cannot read property 'Controller' of undefined

我想把它添加到shim,但由于插件不是特别依赖于任何东西(尚未),它应该是必要的。

我在这里做错了什么?

就像您为jQuery添加$一样,您需要为传入的其他模块添加参数

require(['jquery', "foundation", "slick", "scrollmagic"], function($, foundation, slick, ScrollMagic) {

这将工作假设这些是AMD兼容模块

如果没有,则需要对它们进行加载,并添加一个exports,将库变量赋值给exports属性。下面是一个来自http://requirejs.org/docs/api.html

的例子
shim: {
    'backbone': {
        //Once loaded, use the global 'Backbone' as the
        //module value.
        exports: 'Backbone'
    },