Question

我是RequireJS的新手。我在Knockout.js中编写了许多自定义绑定，并希望使用模块将它们拆分。

目前我的代码布局是：

/
  default.html
  js
    code.js
    require-config.js 
    lib
      /require.js
      bridge
        bridge.js
        bindings1.js
        bindings2.js
        bindings3.js

我想从default.html加载bridge.js并在所有绑定文件中加载。我尝试使用require函数使用或内联js加载bridge.js。

我的require-config非常简单：

require.config({
    baseUrl: '/'
});

在bridge.js中，我在使用相对路径加载文件时遇到问题。我试过了：

require(['./bindings1', './bindings2', './bindings3'], function () {
    console.log('loaded');
});

但是这只是使用路径baseUrl +'bindings1.js'，例如。我在bridge.js中尝试了各种迭代。我唯一的成功就是如果我写完整条道路：

require(['js/bridge/bindings1', 'js/bridge/bindings2', 'js/bridge/bindings3'], function () {
    console.log('loaded');
});

但这不是我想要的。这似乎是一个非常基本的用例，我想我可能会误解相对路径是如何工作的。

由于

Answer 1

相对于解析ID的模块ID解析相对ID。请参阅AMD spec的module id format部分。

有两种方法可以将相对依赖关系ID构建到正确的上下文/范围中：

定义调用

定义调用是“模块”的开始/定义。在define()调用中要求的所有依赖关系都限定在该模块的ID内/相对于该模块的ID。例如：

// does not matter what the file name is.
define(
    'hand/named/module'
    , ['./child']
    , factoryFunction
)

或

// inside of 'hand/named/module.js' file.
define(
    ['./child']
    , factoryFunction
)

在上述两种情况下，./child都会根据define()调用定义的模块ID进行解析。两种情况下的模块ID均为hand/named/module，./child已解析为hand/named/child（显然，+'。js'，当时间到了）

“Scoped”需要

您可以通过覆盖require来自全局的呼叫更改范围。实际上，您不需要覆盖/保留名称require，这就是它所做的更改的含义。 require函数变为特定模块的“本地”。

// inside 'hand/named/module.js' file
define(
    ['require']
    , function(myLocalRequire){
        require('./child', function(){
            // outcome A
        })
        myLocalRequire('./child', function(){
            // outcome B
        })
    }
)

在结果A中，您继续使用“全局”要求 - 附加到父范围的要求。您的./child已解析为baseURL +'/ child'

结果B是本地范围的，与模块ID hand/named/module相关联，因此，./child已解析为hand/named/child

@CristiPufu建议用本地对象覆盖全局require变量，该变量只对该函数的范围是本地的：

// inside 'hand/named/module.js' file
define(
    ['require']
    , function(require){
        return function(){
            // here we have access only to "local" require,
            // since in the function declaration you decided to
            // override the 'require' variable with new object.
            // All code outside of this function will use global require.
            require('./child', function(){
                // outcome B
            })
        }
    }
)

我的偏好是将所有相关资源放在define调用中。因为它们清楚地表达了它们的相对性，所以使它们变得明确且变得有趣。

Answer 2

在require config中使用“packages”。这里有效的答案问题topic

require.config({
packages: [
{ 
    name: 'packagename',
    location: 'path/to/your/package/root',  // default 'packagename'
    main: 'scriptfileToLoad'                // default 'main' 
}]
   ... some other stuff ...
});

在包内，您将能够使用相对路径。

RequireJS相对路径

2 个答案:

定义调用

“Scoped”需要