方法在使用 requireJS 时不会触发

method won't trigger when using requireJS

本文关键字：requireJS 方法      更新时间：2023-09-26

我对某些requireJS设置有一些问题。我之前发布了一个问题，但现在最新的范围发生了变化。

我有一些 

requirejs.config({
    paths: {
        'tmpl': 'vendor/upload/tmpl.min'
    }
});
require({
    paths: {
        'videoupload': 'vendor/upload/jquery.ui.videoupload'
    }
}, ['js/main_video.js'], function (App) {
    App.initial_video_upload();
});

最后在main_video.js： 

define(['tmpl', 'videoupload'], function () {
        function initial_video_upload(tmpl, videoupload) {
            'use strict';
            $('#videoupload').videoupload({
                //...some code
            });
        }
        return{
            initial_video_upload: initial_video_upload
        }
    }
);

如果我不使用requireJS（经典地加载每个文件），则此代码可以完美运行。其实当这段代码被触发的时候，我就一直有消息Uncaught TypeError: Object [object Object] has no method 'tmpl'，这个方法是在tmpl.min.js中定义的。并且此方法在vendor/upload/jquery.ui.videoupload中被调用，因此 

$.widget('videoupload', {
//...
_renderVideo: function (video) {
    this._templateElement().tmpl({
        id: video.id,
        name: video.title
    }).appendTo(this._listElement()).find(
        this.options['delete-selector']
    );
    return this;
},
//...

我该如何管理？（我之前有这个方法tmpl的错误超时消息，但现在它消失了，所以我认为不是这样）

在配置对象中，路径不是 JS 文件的完整路径，而是包含 JS 文件的目录的路径，因此您可能希望在 main_video.js 文件中执行以下操作：

requirejs.config({
    paths:{
        'upload': 'vendor/upload'
    }
});
define(['upload/tmpl','upload/jquery_videoupload'],function(tmpl, videoupload) {
        function initial_video_upload(tmpl,videoupload){
            'use strict';
            $('#videoupload').videoupload({
                //...some code
            });
        }
        return{
            initial_video_upload: initial_video_upload
        }
    }
);

在主应用程序中：

requirejs.config({
    paths:{
        'js': 'path/to/your/js/folder'
    }
});
require(['js/main_video'], function(App) {
    App.initial_video_upload();
});

问题代码中存在问题，因此：

define(['tmpl', 'videoupload'], function () {

应该变成这样：

define(['tmpl', 'videoupload'], function (tmpl, videoupload) {

第一个不会将加载的依赖项暴露给闭包函数的局部变量，因此这可能是一个问题，尽管从提供的代码来看，它是否是唯一的

不是很清楚。

我还想提一下，如果您打算使用优化器，那么使用多个 requre.js 配置并不是一件好事。配置将被最后一个配置覆盖，因此整个项目实际上只有一个配置是个好主意。

喜欢这个：

requirejs.config({
    paths: {
        'tmpl': 'vendor/upload/tmpl.min',
        'videoupload': 'vendor/upload/jquery.ui.videoupload'
    }
});
相关文章：