RequireJS相对路径

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规范的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".这里是您的有效答案问题主题

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

在包内,您将能够使用相对路径.