如何避免杜兰达尔 2 中的全局变量

How to avoid global variables in Durandal 2

本文关键字：全局变量 何避免 杜兰达      更新时间：2023-09-26

据我所知，Durandal 2.x假设没有全局库。以下是从文档中定义全局模块的代码：

define('jquery', function () { return jQuery; });
define('knockout', function () { return ko; });

如果我理解的目的正确，则应以以下方式在模块中使用这些依赖项：

define(['jquery', 'ko'],
    function (jquery, ko) {
         debugger;
    });

但是这些依赖项(jquery, ko)都没有在模块的作用域中定义。你能帮我弄清楚我在这里错过了什么吗？

有两种方法可以在 Durandal 中加载 knockout 和 jQuery（以及其他第三方库）。

通过脚本标签

<script type="text/javascript" src="~/Scripts/jquery-1.9.1.js"></script>
<script type="text/javascript" src="~/Scripts/knockout-2.3.0.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.js"></script>

例如，请参阅Microsoft .NET 示例https://github.com/BlueSpire/Durandal/blob/master/platforms/Microsoft.NET/Samples/Durandal.Samples/Views/Home/Index.cshtml#L31

在这种情况下，您可以使用上述语法使requirejs知道这些库已经加载，因为Durandal相互使用它们作为AMD模块。但是，在您自己的模块中，您可以省略此声明，因为"ko"和"$"是全局可访问的。

对于某些人来说，这是务实的方式，因为处理不兼容AMD的第三方库更容易。

如果避免全局变量是重中之重，那么 requirejs 也可以这样配置。

通过 requierejs 加载所有内容。只需要一个脚本标记

<script src="lib/require/require.js" data-main="app/main"></script>

例如，请参阅 HTML 示例 https://github.com/BlueSpire/Durandal/blob/master/platforms/HTML/Samples/index.html#L43

在 main 中.js有一个具有路径和填充程序配置的 requirejs.config 对象。有关完整的可用选项集，请参阅 http://requirejs.org/docs/api.html。

主.js

requirejs.config({
    paths: {
        'text': '../lib/require/text',
        'durandal':'../lib/durandal/js',
        'plugins' : '../lib/durandal/js/plugins',
        'transitions' : '../lib/durandal/js/transitions',
        'knockout': '../lib/knockout/knockout-2.3.0',
        'bootstrap': '../lib/bootstrap/js/bootstrap',
        'jquery': '../lib/jquery/jquery-1.9.1'
    },
    shim: {
        'bootstrap': {
            deps: ['jquery'],
            exports: 'jQuery'
        }
    }
});

例如 https://github.com/BlueSpire/Durandal/blob/master/platforms/HTML/Samples/app/main.js

这一次，在你自己的模块中，你必须将"knockout"和"jquery"声明为依赖项（如果你使用它们），否则requirejs会抛出错误。

相关文章：