Question

我将此应用程序设计为具有main.js文件，该文件在所有页面上执行。在适用的情况下，我每页都会创建JavaScript文件。每页JS执行正常，但我注意到main.js通常只加载硬盘刷新，其中包含每页javascript文件。我将在下面说明设置：

<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');
})

如果有更好的方法，我愿意重做这个架构，但我想至少弄清楚我遇到的这个问题。

Answer 1

据我所知，requirejs配置中的 deps 属性是要加载的依赖项数组。在加载require之前将require.js定义为配置对象时很有用，并且您希望指定在定义require（）后立即加载的依赖项。这样说，它只发生一次，恰好在加载require.js时，并且是main.js仅执行一次的原因。

请注意，使用 deps 就像对任何其他模块执行require([])调用一样，但只要加载require.js并且加载程序已处理完配置就会完成。

如果您希望main.js在每个页面上投放，则需要手动required

app / user / form.js

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

RequireJS不执行所有文件

1 个答案: