r.js优化器-使用一些模块和一些垫片构建一个全包式js

Question

当所有脚本单独加载时，所有内容都像一个超级按钮。 我现在正在尝试优化。

但是，由于加载的某些.js是填充程序，因此它无法正常工作，在控制台中没有JavaScript错误，似乎没有任何执行。

testRjs.js文件

({
    baseUrl: "./dist/",
    paths: {
        "requireLib": "./require",
        "app": "./app",
        "main": "./main",
        "jquery": "./jquery-2.1.4",
        "jqbsace": "./jqbsace",
        "datatables": "./jquery.dataTables",
        "moment": "./moment",
        "momentTZ": "./moment-timezone",
        "momentDF": "./moment-duration-format",
        "datarangepicker": "./daterangepicker/daterangepicker",
        "highstock": "./highstock",
        "bootstrap": "./bootstrap",
        "aceconcat": "./aceconcat",
        "jstz": "./jstz-1.0.4.min",
        "shared": "./controllers/shared1",
        // Controller modules
        "casnodes/chronicnodes": "./controllers/casnodes/chronicnodes"
    },
    shim: {
        "datarangepicker": ["jquery"],
        "highstock": ["jquery"],
        "jstz": {
            exports: "jstz"
        },
        "bootstrap": ["jquery"],
        "aceconcat": ["bootstrap"],
        "momentTZ": ["moment"],
        "momentDF": ["moment"]
    },
    name: "casnodes/chronicnodes",
    out: "chronicnodesTest.js",
    wrapShim: true,
    include: ["requireLib"]
})

chronicnodes模块：

define(["jquery", "datatables", "highstock", "moment", "datarangepicker", "aceconcat"], function($) {

    $('#allChronicView').DataTable({
        ajax: {
            url: ajaxUrl
        },
        dom: 'Bfrtip',
        buttons: [{
                extend: 'excel',
                text: 'Export (Excel)'
            },

            {
                extend: 'csv',
                text: 'Export (CSV)'
            },

            {
                extend: 'pdf',
                text: 'Export (PDF)'
            }
        ],
        'columns': [{
            'type': 'num',
            'data': 'NodeId',
            render: function(data, type, row) {
                return '<a id="http://shield?id=' + data + '" onclick="return false;"> ' + data + ' </a>'
            }
        }, {
            'data': 'Name'
        }, {
            'data': 'Alias'
        }, {
            'type': 'string'
        }, {
            'type': 'string'
        }, {
            'type': 'date',
            'data': 'DateQuery'
        }, {
            'type': 'num',
            'data': 'Condition'
        }, {
            'type': 'num',
            'data': 'TimeSecLastCondition'
        }, {
            'type': 'num',
            'data': 'Occur'
        }, ],
        "columnDefs": [{
            "targets": 0,
            "visible": false
        }, {
            // The `data` parameter refers to the data for the cell (defined by the
            // `data` option, which defaults to the column being worked with, in
            // this case `data: 0`.
            "render": function(data, type, row) {
                var mDate = moment(data);
                return mDate.tz(jstz.determine().name()).format('M/D/YYYY HH:mm:ss z');
            },
            "targets": 5
        }, {
            "render": function(data, type, row) {
                var str = row["Name"].substring(3, 5);
                return str;
            },
            "targets": 3
        }, {
            "render": function(data, type, row) {
                var str = row["Name"].substring(5, 9);
                return str;
            },
            "targets": 4
        }]
    });
});

像这样的建筑：

节点r.js -o testRjs.js

像这样在HTML中包括：

<script>
        var ajaxUrl = '@Url.Content(url)';
</script>
<script src="~/Scripts/chronicnodesTest.js"></script>

顺便说一句，chronicnodes.js文件没有任何东西嵌套在$（document）.ready（）中，这可能是一个问题吗？

感谢帮助。

Answer 1

您应该检查对shim的使用。

例如moment-timezone调用define ，您可以在这里看到：

if (typeof define === 'function' && define.amd) {
    define(['moment'], factory);                 // AMD
}

因此它不需要shim 。 将填充程序与调用define代码一起使用会导致未定义的行为。 有时它没有效果，但有时会引起问题。 因此，在此处不需要moment-timezone的时差shim不会在优化之前引起问题，而在优化之后引起问题就不足为奇了。

您应该检查的另一件事是，是否有使用shim模块需要exports选项。 您显然使用的某些模块不需要 exports 。 例如，Bootstrap会自行安装一个jQuery插件，而不是在全局空间中声明符号。 但是，您使用的其他模块可能需要exports 。 （我不熟悉您使用的所有模块，所以我不确定。）如果没有wrapShim: true您可能会丢失丢失的exports但是启用此选项后，丢失的exports将导致您的代码失败。 对于未优化的代码，这不是问题。