如何加载采用不同 baseURL 的模块

How to load modules which assume different baseUrl

本文关键字：baseURL 模块 何加载 加载      更新时间：2023-09-26

我有一个文件结构，看起来像这样：

/js
 |-module/myModule.js
 |-test.js
/vendor/
/spec
 |-main.js
 |-js/app.js

spec/main.js是我的入口点，我从中加载/js, /vendor模块，/spec

加载vendor和spec中的模块我没有问题，因为这些模块是假设baseUrl = '/'构建的。

我在/js中加载模块时遇到问题，因为这些模块是假设baseUrl = '/js'构建的。

如何在不更改脚本代码的情况下解决此问题'/js'？

下面是一个示例，其中包含描述问题的内联注释。

规格/主要.js

(function () {
    'use strict';
    require.config({
        baseUrl: '../'
    });
});
define([
    'spec/js/app' // it works
], function (app) {
    'use strict';
    app.initialize();
});

spec/js/app.js

(function(){
    'use strict';
    define([
        'js/module/myModule' // it works
    ], function () {
     // some code
    });
});

js/module/myModule.js

(function(){
    'use strict';
    define([
        'test' // it does not works because
               // it assumes that baseUrl equals '/js' and not '/'
    ], function () {
     // some code
    });
});

首先，我缺少包装代码的匿名函数中的所有（）。

例如，在这段代码中：

(function () {
    'use strict';
    require.config({
        baseUrl: '../'
    });
}()); // <-- missing ()

基本上，这段代码什么都不做，因为没有被执行。当你把你的代码包装在一个匿名函数中（以避免污染全局范围，使你的代码更容易最小化，...），你必须执行它！ 但当你写这篇文章时，这可能是一个错字。

我有几个解决方案，但我担心它们不能轻松解决您的问题或 100% 的情况（我不是说没有那个解决方案，我只是说我不知道）

首先，您可以在require.config对象中定义路径，如下所示：

require.config({
    baseUrl: '../',
        paths : {
            test : 'js/test.js'
    }
});

这样，您的代码就可以工作了。我知道这不是最好的解决方案，因为您必须在每个文件的路径中定义一个条目，我想您正在寻找更通用的解决方案。

使用 path，您始终可以在一个包（一组模块）的依赖项中设置前缀，因此您可以在包中组织代码，并在该模块的任何依赖项中添加前缀。如果包有一个主文件，你可以根据需要将路径添加到require.config PREFFIX，以链接到该模块当前位置的路径。

我能想到的另一个解决方案是在 js 中的模块中使用相对路径。如果您经常遇到此问题，也许您应该从现在开始始终使用相对路径定义模块的依赖项。所以

define([
        'test'
    ], function () {
        ...
);

将变成：

define([
        '../test'
    ], function () {
        ...
);

但是，由于我无法为您的问题想出任何真正的解决方案（在不更改 js/文件代码中的任何内容的情况下解决这个问题），如果您习惯于在不同项目之间重用一组模块，我建议开始在包的依赖项中使用相对路径。当然，以某种方式组织文件。

让我们看看是否有人为您的问题提供真正的解决方案。

相关文章：