javascript - 关于 requirejs 动态加载模块的建议或在我的情况下使用优化/捆绑工具

Question

我正在构建一个新的 Web 应用程序，该应用程序将包含完全不同的界面/用户体验，具体取决于刚刚经过身份验证/登录的用户类型。让我们将这些用户称为管理员和代表。

管理员和代表在此应用程序中具有完全不同的功能。两者只会使用我的模块的一小部分。它本质上是连接到我的后端的两个不同的客户端应用程序。

我是否应该使用 RequireJS 优化器创建两个不同的构建文件，然后根据用户执行登录时服务器返回的内容将其中一个注入(inject)到页面中？或者我应该更多地关注requirejs的动态模块加载，并在需要时加载我需要的模块(从而遇到很多额外的http请求:/)

Answer 1

我们有一个 Backbone 应用程序，它共享许多 View 和模型，但并非所有客户端都拥有所有导航点，并且某些模型的行为有所不同。

因此，首先我们为每个客户端提供一个 require 入口点和一个 require.config。

Bootstrap-client1.js

requirejs.config({
  baseUrl: 'js/cfe/app',
  paths: {
    'common/ViewA': 'clients/client1/ViewA',
    'common/ModelB': 'clients/client1/ModelB',
    'common/ColletionC': 'clients/client1/CollectionC'
  }
});

requirejs([
  'common/App',
  'common/BaseSetup'],

  function(app, BaseSetup) {
    $(function() {

      BaseSetup.start();

      app.start();
    });
  }
);

因此，稍后当我们使用需要 ModelB 的共享 View 时，这将替换为我们的 client1/ModelB 实现。

对于生产，我们使用 r 编译器为每个客户端构建单个编译版本，并在客户端请求 html 文件时更改 html 文件中的 data-main 属性的源。