RequireJs：使用r.js构建模块路径不存在错误

Question

我正在使用RequireJs，并且在构建时遇到问题。

我的结构

webroot 
    css 
    /* css here */ 
    files 
    img 
    js 
    emails 
     verify.js 
    lib 
     jquery-1.8.3.min.js 
     jquery-ui.min.js 
     jquery.ui.selectmenu.js 
     modernizr.js 
     require.js 
    orders 
     form.js 
    common.js 
    js-build 
    /* expected build output here */ 
    js-tools 
    app.build.js 

这是一个CakePHP的项目的一部分，但Web根目录是Web服务器的实际根目录会。

node和r.js.cmd都在我的路径上，所以我没有将它包含在js-tools目录中。

访问默认页面时，为/，但它也可能显示为/ orders/form。出于这个原因，JS的相关Url是一个问题。

当我加载JS，我使用

<script type="text/javascript" src="/js/lib/require.js"></script> 
<script type="text/javascript"> 
//<![CDATA[ 
require(['/js/common.js'], function(common){ 
    require(['orders/form']); 
}); 

//]]> 
</script> 

这是从https://github.com/requirejs/example-multipage-shim拍摄。

我common.js是

requirejs.config({ 
    "baseUrl": "/js/lib", 
    "paths": { 
     "orders": "../orders", 
     "emails": "../emails", 
     "jquery": [ 
      "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min", 
      "jquery-1.8.3.min" 
     ], 
     "jquery-ui": [ 
      "//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min", 
      "jquery-ui.min" 
     ] 
    }, 
    "shim": { 
     "jquery.ui.selectmenu": ["jquery", "jquery-ui"] 
    } 
}); 

因为它的立场，这一点也适用未优化的代码时。重要的特征是js被绝对URL引用，是否可以通过/或/ orders/form中的代码来获取。

我app.build.js是

({ 
    appDir: '..', /* relative to app.build.js */ 
    mainConfigFile: '../js/common.js', /* relative to app.build.js */ 
    baseUrl: 'js/lib', /* relative to current directory */ 
    dir: '../js-build', /* relative to app.build.js */ 
    optimize: 'uglify2', 
    paths: { 
     "jquery": "empty:", 
     "jquery-ui": "empty:", 
     "jquery.ui.selectmenu": "empty:", 
     "common": "../common", 
     "orders": "../orders", 
     "emails": "../emails" 
    }, 
    modules: [ 
     { 
      name: 'common', 
      include: [ 
       'modernizr' 
      ], 
      exclude: ['jquery-1.8.3.min', 'jquery-ui.min', 'jquery.ui.selectmenu'] 
     }, 
     { 
      name: 'orders/form', 
      exclude: ['common', 'jquery.ui.selectmenu'] 
     }, 
     { 
      name: 'emails/verify', 
      exclude: ['common', 'jquery.ui.selectmenu'] 
     } 
    ] 
}) 

当优化，r.js.cmd -o js-tools\app.build.js从根目录运行时，我得到一个js-build目录与整个的webroot目录的副本，最优化。虽然不是很理想（我想限制它只是js目录得到优化），但我可以使用我的Ant驱动构建脚本将js-build \ js目录的内容复制到正确的位置。

当我从命令行运行构建时，生成的common.js，orders/form.js和emails/verify.js都排除了jquery.ui.selectmenu。 common.js包含modernizr，以及来自同一个lib的头文件。 form.js和verify.js也排除jquery.ui.selectmenu，并且没有任何头文件。

但是，当我从我的Ant脚本运行时，orders/form.js和emails/verify.js包含jquery.ui.selectmenu和modernizr，即使我已经给出了针对common和jquery.ui.selectmenu的特定指令被排除在外。

我已经排除了jquery.ui.selectmenu，因为我正在使用的特定版本被写入以下表单，并且浏览器有一个结束jQuery变量不可用的问题。通过排除jquery.ui.selectmenu，我可以尝试单独加载它，就像它来自CDN一样。

(function($, undefined) { 
    $.widget("ui.selectmenu", {... 
    }); 
}(jQuery)); 

所以，我的问题是，同一个app.build.js怎么会导致不同的输出？

Answer 1

当处理相对路径时，您可能需要包含一个“。”在路径字符串的开头（指定您想要从当前路径开始）。我最近遇到这个问题，同时在grunt上测试r.js。我已经将我的baseUrl设置为“/”最初应该是“。“

在你的情况，你的baseUrl设置为‘JS/lib目录’ - 也许尝试”的.js/lib目录”

这是一个有点怪异，因为我得到了似乎是错误消息有正确的基本路径以及相对路径，但r.js仍然无法找到文件。

这个问题很老，但我看到它有一堆的意见，所以我想我会把这个在这里，因为它可能会帮助别人。