2017-10-13 50 views
1

我设计这个应用程序有一个main.js文件,该文件的所有网页上执行。在适用的情况下,我正在为每个页面创建JavaScript文件。每页JS都执行得很好,但我注意到main.js通常只会在每页JavaScript文件中包含的硬刷新上加载。我将举例说明如下设置:RequireJS不予执行所有文件

<script src="/admin/js/require.config.js"></script> 
<script src="/admin/js/lib/require.js" data-main="./app/user/form"></script> 

require.config.js

var require = { 
    baseUrl: '/admin/js', 
    paths: { 
     main: 'app/main', 
     bootstrap: 'lib/bootstrap', 
     "datatables.net": 'lib/jquery.datatables', 
     datepicker: 'lib/bootstrap-datetimepicker', 
     dropzone: 'lib/dropzone', 
     moment: 'lib/moment', 
     notify: 'lib/bootstrap-notify', 
     paper: 'lib/paper-dashboard', 
     jquery: 'lib/jquery', 
     select: 'lib/bootstrap-select', 
     sortable: 'lib/Sortable.min', 
     swal: 'lib/sweetalert2', 
     switchTags: 'lib/bootstrap-switch-tags', 
     wizard: 'lib/jquery.bootstrap.wizard.min', 
     validate: 'lib/jquery.validate.min', 
     yummySearch: '/yummy/js/yummy-search', 
     zxcvbn: 'lib/zxcvbn' 
    }, 
    shim:{ 
     bootstrap:{ 
      deps: ['jquery'] 
     }, 
     validate: { 
      deps: ['jquery'] 
     }, 
     wizard:{ 
      deps: ['bootstrap'] 
     }, 
     select:{ 
      deps: ['bootstrap'] 
     }, 
     datepicker:{ 
      deps: ['bootstrap','moment'] 
     }, 
     switchTags:{ 
      deps: ['bootstrap'] 
     }, 
     paper: { 
      deps: ['bootstrap','switchTags'] 
     }, 
     notify: { 
      deps: ['jquery','bootstrap'] 
     }, 
     "datatables.net": { 
      deps: ['jquery'] 
     }, 
     main: { 
      deps: ['paper','notify','moment','datepicker','swal'] 
     } 
    }, 
    deps: ['main'] 
}; 

main.js

require(['jquery','swal','yummySearch','notify'], function($, swal) { 
    console.log('does not always execute'); 
}); 

应用/用户/ form.js

define(['jquery','swal','validate','datatables.net'], function($,swal) { 
    console.log('will always run when loaded via data-main'); 
}) 

我愿意接受,如果有更好的方法重做这个架构,而是想至少搞清楚这个问题我遇到。

回答

0

据我所知,deps属性requirejs配置是一个依赖加载数组。有用的,当作为require.js之前配置对象加载require定义,并要指定依赖尽快需要加载()定义。话说,它只会发生一次,什么时候该require.js被加载,并且是原因,你只main.js执行一次。

注意,使用的DEP就像做了require([])调用任何其他模块,但作为require.js加载尽快完成,装载机已处理的配置。

如果你希望你的main.js在每个页面上运行,那么你将需要手动required

应用/用户/ form.js

define(['main','jquery','.... other deps'], function(main, $, others) { 
    console.log('main will always run'); 
}) 
+0

我一直在努力避免这种情况,但这是我过渡时期的路线。 – systematical