如果其他的JS文件互相依赖怎么使用require?

项目中使用了photoClip.js依赖于iscroll-zoom.js(v5.1.3),然后自己写的函数调用了photoClip.js中的方法;我的项目中使用了下面的代码,然后在控制台报:IScroll is not a constructor,查找到photoClip中对iscroll实例化引起的这个错误,想咨询下什么原因引起的?

2017.1.14 根据几个同学的回答修改了path和依赖的名字,但是还是报那个错,不知道那里的问题,下面代码已更新

2017.1.17 由于自身学习能力不够,本来能够去github找答案的贸贸然在segmentfault提问了,现在下面提供了解决办法,自省己身:多读文档、多读文档、多读文档。

require.config({
                paths : {
                    "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery"],
                    "sendpoint":["js/sendpoint"],
                    "layer":["layer/layer"],
                    "hammer":["js/lib/hammer"],
                    "photoClip":["js/lib/jquery.photoClip"],
                    "exif":["js/lib/exif"],
                    "Iscroll":["js/lib/iscroll-zoom"]
                },
                shim: {
                    'layer': {},
                    "Iscroll":{}
                }
            })
            require(["sendpoint","Iscroll","layer","hammer","photoClip","exif"],function(){
                                $(function(){
                  $("#clipArea").photoClip({
                    width: 230,
                    height: 230,
                    file: "#images",
                    view: "#view",
                    ok: "#clipbtn",
                    loadStart: function() {
                      var fontSize = $("html").css("fontSize");
                      $("#clipArea").css({
                        "height":"11rem",
                        "font-size":0
                      });
                      $("#toload").css("display","block");
                    },
                    loadComplete: function(){
                      $("#showEdit").css("display","block");
                      $("#toload").css("display","none");
                    },
                    clipFinish: function(dataURL) {
                      
                    }
                  });
                })

            });
阅读 6.1k
3 个回答

由于这个错误是在photoClip依赖iscroll的问题引起的,所有在github上找到了photoClip的文档找到的解决办法:

require.config({
    paths: {
        'iscroll-zoom': 'js/iscroll-zoom',
        'hammer': 'js/hammer.min',
        'lrz': 'js/lrz.all.bundle',
        'PhotoClip': 'js/PhotoClip'
    },
    shim: {
        'iscroll-zoom': {
            exports: 'IScroll'
        }
    }
});

require(['PhotoClip'], function(PhotoClip) {
    new PhotoClip('#clipArea');
});

在path参数中,设置了模块名称(可以随意指定),在shim参数中,exports是输出的变量名,表明这个模块外部调用时的名称

你require和定义的模块名不一样.. iscrollIscroll

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题