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 module：

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，您可以看到here：

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

所以它不需要shim。使用带有调用define的代码的填充程序会导致未定义的行为。有时它没有任何效果，但有时会产生问题。因此，对于shim不必要的moment-timezone在优化之前不会导致问题但在之后导致问题并不特别令人惊讶。

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

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

1 个答案: