Загрузка только необходимых файлов js с использованием requirejs

Question

Я разрабатываю приложение, в котором я использовал requirejs и магистраль на интерфейсе.

Я настроил requirejs для загрузки всех js-файлов.

Мой main.js файл выглядит примерно так:

require.config({ 
    baseUrl: 'js', 
    paths: { 
     "jquery": 'lib/jquery', 
     "jquery.ui.widget" : "lib/jquery.ui.widget", 
     "jquery.knob" : "lib/jquery.knob", 
     "jquery.iframe-transport" : "lib/jquery.iframe-transport", 
     "jquery.fileupload" : "lib/jquery.fileupload", 
     "socket" : "lib/socket.io", 
     "handlebars": 'lib/handlebars', 
     "underscore": 'lib/underscore', 
     "bootstrap" : 'lib/bootstrap', 
     "backbone": 'lib/backbone', 
     "views" : "views", 
     "models" : "models", 
     "collections" : "collections", 
     "text" : "lib/helper/text" 
    } 
}); 

require(['jquery', 
     'handlebars', 
     'underscore', 
     'backbone', 
     'login', 
     'jquery.ui.widget', 
     'jquery.knob', 
     'jquery.iframe-transport', 
     'jquery.fileupload', 
     ],function($, 
        Handlebars, 
        _, 
        Backbone, 
        Login){ 
    Login(); 
}); 

мои файлы входа выглядит следующим образом:

define(function(require){ 
    return function(){ 
     var LoginView = require("views/login_view"); 
     $("#createAccount").click(function(){   
      $("#signInContainer").addClass("hide"); 
      $("#register").removeClass("hide"); 
     }); 
     var view = new LoginView({el : "body"}); 
    } 
}); 

объект вида является объектом Backbone.View, который начинается следующим образом:

define(function(require){ 
    var User = require("models/user"); 
    var Dashboard = require("views/dashboard"); 

    //... rest of the code 

} 

Файл Login_view.js содержит 2 других js-файла, необходимых в нем.

Аналогичным образом все остальные страницы, которые будут вызываться после входа в систему, также имеют в них такие требования.

Вопрос: Когда страница загружается, все такие вложенные запросы загружаются. , например. требуют инструкции в файле js панели управления, который требуется для входа в систему, также загружается.

Я хочу решение, с помощью которого я хочу, чтобы загружались только начальные файлы. файлы внутри панели мониторинга должны загружаться только тогда, когда я хочу создать экземпляр объекта панели мониторинга.

Answer 1

Вам необходимо изменить логику кода и использовать requireJS для запроса файла js только по требованию. См. Приведенный ниже пример, который загружает панель мониторинга, когда пользователь нажимает на элемент внутри страницы.

define(function(require){ 
    var User = require("models/user"); 

    //...my code 
//ex on user click 
$("#myElement").on("click",function(){ 

    require(["views/dashboard"],function(Dashboard){ 

     //code for Dashboard here 
    }); 
}); 

}