多页应用程序中的正确 URL答案

【问题标题】：Correct URLs in multipage app多页应用程序中的正确 URL
【发布时间】：2013-08-18 21:49:06
【问题描述】：

我有一个基于此示例的多页面主干应用程序：https://github.com/asciidisco/grunt-requirejs/tree/master/examples/multipage-shim，它适用于基本 url。当我导航到不再位于域根目录的页面时，问题就出现了。

目录结构如下：

scripts
  ├── app
  │   ├── controller
  │   │   ├── Base.js
  │   │   ├── c1.js
  │   │   └── c2.js
  │   ├── lib.js
  │   ├── main1.js
  │   ├── main2.js
  │   ├── model
  │   │   ├── Base.js
  │   │   ├── m1.js
  │   │   └── m2.js
  ├── common.js
  ├── page1.js
  └── page2.js

所以，例如如果我导航到http://localhost/，所有内容都会使用以下脚本标签正确加载：

    <script data-main="/scripts/page1"  src="/path/to/require.js">

（这会加载 page1，然后加载 common.js 和 main1.js）。

但是，如果我导航到 http://localhost/another/url/，那么相同的脚本标签会成功加载 page1.js 和 common.js，但是当它尝试加载 main1.js 时，我得到一个 404，因为它是从一个亲戚加载的URL（尝试加载http://localhost/another/url/scripts/app/main1.js。

我的 baseUrl 设置为 'scripts'，我正在使用 grunt (https://github.com/asciidisco/grunt-requirejs) 进行构建。

page1.js 的内容是这样的：

//Load common code that includes config, then load the app logic for this page.
require(['./common'], function (common) {
    require(['app/main1']);
});

【问题讨论】：

标签： backbone.js requirejs gruntjs

【解决方案1】：

对于遇到这个问题的人，我找到了这个解决方法：

require.js 支持有两个单独的baseUrl 参数，一个用于构建步骤，一个用于部署的javascript。

通过设置构建 baseUrl: 'scripts' 和部署的 baseUrl: '/scripts'，我能够确保 require 始终尝试从服务器上的根目录获取脚本。

【讨论】：