Question

我的项目是使用Django设置的，我的任务是在整个项目中实现requireJS，以便开始模块化我们的JavaScript。因为我们使用Django意味着我们也在使用嵌套模板，这是复杂性的开始。

以下基本上是我现在正在进行的设置：

// template.html
<script src="require.js">
<body>
    ... some html ...
    {% include "body.html" %}
</body>
<script>
    requirejs(['static/require/main.js'], function() {
        requirejs(['static/app/template.js']);
    });
</script>

// body.html
<div>
    ... some html ...
</div>
<script>
    requirejs(['static/require/main.js'], function() {
        requirejs(['static/app/body.js']);
    });
</script>


// compiled HTML:
<script src="require.js">
<body>
    ... some html ...
    <div>
        ... some html ...
    </div>
    <script>
        requirejs(['static/require/main.js'], function() {
            requirejs(['static/app/body.js']);
        });
    </script>
</body>
<script>
    requirejs(['static/require/main.js'], function() {
        requirejs(['static/app/template.js']);
    });
</script>


// main.js
requirejs.config({
    paths: {
        'jquery': '...'
    }
);

// body.js
define('app/bodyjs', ['jquery'], function() {
    ... some js ...
});


// template.js
define('app/template.js', ['jquery'], function() {
    ... some js ...
});

我想要的是能够清理嵌套的requirejs（）调用。

我更愿意

// body.js
define('app/body.js', ['/static/require/main.js', 'jquery'], function () {
    ... some js ...
});

但最终在/jquery.js中寻找jquery，这是不正确的，其中正确的路径是/static/lib/jquery.js

关于如何清理它的想法？

Answer 1

（前面的说明：我在你的所有模块名称中都看到了.js个扩展名。除非你有强制的理由，否则你不应该在模块名称中添加.js。你>添加.js。）

我认为/static/require/main（没有扩展名）包含您的RequireJS配置。您遇到的问题是RequireJS异步加载所有模块，但您需要在加载任何其他内容之前加载配置。一种解决方案是像您一样嵌套require次呼叫。

另一种解决方案是同步加载配置：

<script type="text/javascript" src="lib/requirejs/require.js"></script> <script type="text/javascript" src="requirejs-config.js"></script>

第一行加载RequireJS，第二行加载包含对require.config的调用的脚本。保证在RequireJS加载任何其他内容之前加载。如果执行此操作，则无法使用data-main，因为data-main指定的模块将在加载配置之前加载。

我在您的代码中注意到的另一件事是您使用模块名称（第一个参数）调用define。您应该保留模块名称，并在优化代码时让r.js添加它们。此处的原则与扩展相同，如果您可以引用这样做的重要原因，请添加模块名称。否则，不要。

RequireJS - 嵌套需要调用，如何清理？

1 个答案: