Загрузить blue-imp jquery-файл с помощью RequireJS

Я пытаюсь загрузить файл jquery с помощью blue-imp с помощью RequireJS.

Я столкнулся с некоторой проблемой при загрузке. Я пробовал решения, подобные этому и этому, но никто не работал с моей ситуацией.

что я сделал в своем main.js является

require.config({
    baseUrl : 'js',
    paths: {
        jquery: 'lib/jquery/jquery-1.11.0',
        jqueryfileupload : 'lib/jquery/jquery.fileupload',
        underscore: 'lib/backbone/underscore/underscore-min',
        backbone: 'lib/backbone/backbone-min',
    },
    shim : {        
    'underscore' : {
        exports : "_"
    },
    'backbone' : {
        deps : [ "underscore", "jquery" ],
        exports : "Backbone"
    },
    'jqueryFileUpload' : {
        deps : ["jquery"]           
    }
});

на мой взгляд, когда я это хвалю

define(['backbone', 'jqueryFileUpload' ],
        function(Backbone, fileupload ) {

});

Это дает мне ошибку на консоли

"NetworkError: 404 Not Found - http://localhost/AppUI/js/jqueryFileUpload.js?cmmn=1409151733588"

Почему он выбирает магистраль по правильному пути и почему jqueryFileUpload напрямую из baseURL?

Я могу выполнять обычные операции jquery, такие как val(), append(), но у этого есть зависимость, поэтому я предоставил это.

Я исследовал немного больше и обнаружил вложенные зависимости для fileupload.js, которые являются jquery ui и widget. Я также импортировал их в свой

        paths : {
            jquery: 'lib/jquery/jquery-1.11.0',
            jqueryUI : 'lib/jquery/jquery-ui-1.10.4.custom.min',
            jqueryfileupload : 'lib/jquery/jquery.fileupload'
        },

       shim : {
           'jqueryUI' : ['jqueryUI'],
           'jqueryFileUpload' : {
                  deps : ["jquery", "jqueryUI", "jqueryIframetransport"],
                  exports : "jQueryFileUpload"
        }
}

Даже после этого я получаю ту же ошибку. Он выбирает неправильный путь.

Какие-либо предложения или подходы, чтобы продолжить?

2 ответа

По этой причине вы не можете использовать конфигурацию shim с jquery fileupload ( конфигурация shim):

//Remember: only use shim config for non-AMD scripts,
//scripts that do not already call define(). The shim
//config will not work correctly if used on AMD scripts,
//in particular, the exports and init config will not
//be triggered, and the deps config will be confusing
//for those cases.

Исходные файлы для загрузки файлов Jquery уже используют сценарии define (AMD)! (посмотрите на jquery.fileupload.js). Даже в этом случае вы можете настроить зависимости requirejs следующим образом:

каталог проекта верхнего уровня (совместимый с бауэром):

* app/
    - modules/
        - module.js
    - vendor/
        - jquery/
            - dist/
                - jquery.js
        - underscore/
            - underscore.js
        - jquery.fileupload-upload/
            - vendor/
                - jquery.ui.widget.js
            - js/
                - jquery.fileupload.js
                - jquery.fileupload.image.js.
                - ...

config.js:

var require = {
    "baseUrl": "/app/",
    "shim": {
        jquery: {
            exports: "$"
        },
        underscore: {
            exports: "_"
        }
    },
    "paths": {
        "jquery": "vendor/jquery/dist/jquery.min",
        "jquery.ui.widget": "vendor/jquery-file-upload/js/vendor/jquery.ui.widget",
        "underscore": "vendor/underscore/underscore-min",
        "bootstrap": "vendor/bootstrap/dist/js/bootstrap.min",
        "tmpl": "vendor/blueimp-tmpl/js/tmpl",
        "load-image": "vendor/blueimp-load-image/js/load-image",
        "load-image-meta": "vendor/blueimp-load-image/js/load-image-meta",
        "load-image-exif": "vendor/blueimp-load-image/js/load-image-exif",
        "load-image-ios": "vendor/blueimp-load-image/js/load-image-ios",
        "canvas-to-blob": "vendor/blueimp-canvas-to-blob/js/canvas-to-blob",
        "jquery.iframe-transport": "vendor/jquery-file-upload/js/jquery.iframe-transport",
        "jquery.fileupload": "vendor/jquery-file-upload/js/jquery.fileupload",
        "jquery.fileupload-process": "vendor/jquery-file-upload/js/jquery.fileupload-process",
        "./jquery.fileupload-process": "vendor/jquery-file-upload/js/jquery.fileupload-process",
        "jquery.fileupload-image": "vendor/jquery-file-upload/js/jquery.fileupload-image",
        "jquery.fileupload-audio": "vendor/jquery-file-upload/js/jquery.fileupload-audio",
        "jquery.fileupload-video": "vendor/jquery-file-upload/js/jquery.fileupload-video",
        "jquery.fileupload-validate": "vendor/jquery-file-upload/js/jquery.fileupload-validate",
        "jquery.fileupload-ui": "vendor/jquery-file-upload/js/jquery.fileupload-ui",
    }
};

модуль:

define(['jquery',
'tmpl',
'load-image',
'load-image-meta',
'load-image-exif',
'canvas-to-blob',
'jquery.iframe-transport',
'jquery.fileupload',
'jquery.fileupload-process',
'jquery.fileupload-image',
'jquery.fileupload-audio',
'jquery.fileupload-video',
'jquery.fileupload-validate',
'jquery.fileupload-ui'],

function ($, ...) {

Ваша конфигурация противоречиво ссылается на ваш модуль с именем jqueryfileupload (в вашем paths) и с jqueryFileUpload (в вашем shimи в вашем звонке define). Вы можете изменить свой paths использоватьjqueryFileUpload так что это везде одинаково.

Когда вы говорите RequireJS о модуле, вы должны ссылаться на него с одинаковым именем везде. Что касается RequireJS, foo, FOO, Foo, FoO все разные модули.

Другие вопросы по тегам