`lib` 中的骨干木偶、RequireJS 和依赖项

Posted 2023-05-07

【中文标题】`lib` 中的骨干木偶、RequireJS 和依赖项

【英文标题】：Backbone Marionette, RequireJS and dependencies in `lib`

【发布时间】：2012-07-15 23:11:21

【问题描述】：

我一直在开发 Backbone/RequireJS 应用程序，现在正在更新它以使用 Marionette。当 Marionette AMD 尝试在根 / 中搜索 jquery、主干和下划线时，它一开始就中断了，但是，我在 /lib 中有这些库，我可以修改代码。解决这个问题的正确方法是什么？ （如果可能，不要将库移出/lib）。

我现在所做的是使用可以工作的非 AMD 版本。但有时，我在某些视图中收到 CollectionView 未定义错误，这让我想知道它是否与为 RequireJS 使用非 AMD 构建有关

【参考方案1】：

您不能（或至少不应该）修改每个库的源代码来告诉它其依赖项在哪里。但是，您可以控制您的代码的位置。

我使用的方法是从 Volo's default project template 复制的，将 RequireJS 的 baseUrl 设置为 /lib 文件夹，这样您的库代码就可以轻松找到它的依赖项，然后使用 paths config 别名 'app ' 到 my 代码所在的任何位置，如下所示：

目录布局

/www 
  /js
    main.js
    /lib
      backbone.js
      backbone.marionette.js
      (etc)
    /app
      my-code.js
      view.js

main.js（或者你配置 RequireJS 的任何地方）

requirejs.config(
    baseUrl: 'www/js/lib',
    paths: 
        app: '../app'
    
);
// Go on to load another module that contains the actual app. Example:
requirejs(['app/my-code']);

paths 配置中的所有路径都相对于baseUrl。像上面那样为app 定义映射意味着当RequireJS 加载一个名为app/foo 的模块时，它将使用(baseUrl)/../app/foo.js ：

我的代码.js

define(['backbone', 'app/view'], (Backbone, MyView) /*...*/

【参考方案2】：

这是一个常见问题，我知道有两种解决方案：

1) 为您的项目修改 AMD 版本的 Marionette。

指定这两个库的正确路径，您就可以开始了。这是 Marionette 依赖列表中的一个简单更改，不会影响其余功能。

但这是个坏主意。这意味着您必须更改代码，并且每次获得新版本时都必须再次更改。

2) 在 requirejs 中使用命名模块/路径

我已将依赖项指定为“jquery”、“underscore”、“backbone”字符串，这意味着您可以使用命名路径来配置这些依赖项所在的位置。

在你的 requirejs 配置中包含这个：

require.config(
  paths: 
    "jquery": "/your/path-to/jquery"
  
);

现在 Marionette 将找到“jquery”依赖项

这是两种解决方案中较好的一种，因为它不需要您更改木偶文件。它只需要你配置 RequireJS 来提供这些命名路径。