如何正确包含每页脚本

时间:2017-02-02 07:01:45

标签: requirejs

我的所有页面都使用了许多共享脚本,例如jquery和其他框架。

但有些页面只有1个脚本文件。例如:Index.html将有一个相应的index.js文件。

我最初的想法是做这样的事情:

 <script data-main="script/includes" src="./script/require.js"></script>
 <script type="text/javascript" src="./escript/index.js"></script>

但在这种情况下,我认为index.js会在require完成它之前加载,所以这对我没有帮助。

我想要做的是加载所有共享内容,然后加载特定于页面的内容。

应该怎么做?

1 个答案:

答案 0 :(得分:0)

您可以将requirejs配置添加到启动或app文件中,如下所示

requirejs.config({
    paths: {
        "jquery": "jquery-1.10.2",
        "jquery-ui": "jquery-ui-1.11.4",
        "General": "General",
        "knockout": "knockout-3.4.0.debug",
        "komapping": "knockout.mapping-latest.debug",
        "modernizr": "modernizr-2.8.3",
        "respond": "respond",
        "underscore": "underscore",
        "datatable": "DataTables/jquery.dataTables",
        "bootstrap": "bootstrap",
        "bootstrap-dialog": "bootstrap-dialog",
        "bootstrap-datepicker": "bootstrap-datepicker"
    },
    shim: {
        "jquery.appender": ["jquery"],
        "jquery.textReplacer": ["jquery"],
        "jquery-ui": {
            "deps": ["jquery"],
            "exports": "$"
        },
        "bootstrap-responsive": {
            "deps": ["bootstrap", "respond"],
            "exports": "bootstrap-responsive"
        },
        "komapping": {
            "deps": ["knockout"],
            "exports": "komapping"
        },
        "bootstrap": {
            "deps": ["jquery"],
            "exports": "bootstrap"
        },
        "bootstrap-dialog": {
            "deps": ["bootstrap", "jquery"],
            "exports": "bootstrap-dialog"
        }
    }
});

您可以创建单独的文件,并在需要js之后包括

    <script src="./Scripts/app.js"></script>

在您的页面特定文件中只注入名称,它将按您指定的顺序加载。

define(['jquery', 'knockout', 'pagespecific path', "knockout-delegatedEvents"],
function ($, ko, viewmodel,koevent) {
    $(function () {

    });
});