如何模块化AngularJS应用程序/插件

Question

关于从Grails(REST-API,AngularJS,MongoDB,Tomcat,Spock,几个插件的部分)到Node.js + Angular.js的迁移,我有几个(软件)架构问题.我可能要解释Grails项目拳头的结构,所以我们在这里:

有一个主要的Grails应用程序(旁边的几个其他应用程序),它建立在几个插件上.这些插件中的每一个都能够自行执行 - 这意味着它有自己的UI,单独的模板,服务,控制器,路由,测试等.它也托管在不同的存储库中.这是由Grails插件机制完成的.其好处是减少了测试工作量,减少了编译时间,模块化,单一职责等等.

但是,编译和测试的时间太贵了.此外,我不喜欢API提供部分模板/视图的事实.我想让后端API"只是作为后端API"和前端"只是作为前端".因此,每个AngularJS应用程序/插件都将提供自己的视图,路由,服务等.但它们也可能依赖于其他插件.

所以我想要实现的目标如下:

• 一个主要的AngularJS应用程序,包括几个插件(一个插件可以是类似报表生成器,留言簿或任何东西,说到应用程序的单个独立部分,具有特定路径,或只是页面的一小部分) ).
• 每个插件必须是一个独立的AngularJS应用程序(可能在开发期间通过grunt等执行).因此,UI开发人员不需要启动整个后端应用程序,因此我们可以仅使用JavaScript运行功能测试
• 仅通过REST进行通信,前端必须从API检索所有数据
• 每个插件必须可以单独测试
• 插件可能需要其他插件才能工作
• 主要的index.html(和app.js？)可能由Nginx服务器提供,该服务器与后端的其余部分(API)分离

虽然我脑子里有一张特定的图片,但我正在努力设置这个架构.

在Grails中,插件机制以某种方式将插件依赖设置(如URL映射,依赖关系等)合并到包含/注入它们的主应用程序中 - 这也是我想用AngularJS实现的.所以:

• AngularJS是否有某种相同的机制？
• 如何将每个插件的路由提供/合并到主应用程序中？
• 如何声明应用程序和插件依赖项？
• 哪些工具可能对构建过程有用？
• 如何建立插件资源(css/less文件,视图,服务等)的延迟检索？
• 阻止应用程序在启动时提供插件的所有资源(我想在启动时需要路由)

因为这不仅仅是一个怎么做这个或那个问题,如果我错过了重要的部分,或者某些部分不够清楚,我会原谅自己.请问我,我将深入回答每个问题.

Answer 1

** 这个答案不完整 **

在深入探讨这个问题之前，我想确保我理解你的意思。

这是用于管理延迟加载（插件、供应商资产、管理内容等）的 Loader 模块的快速实现。

这有帮助吗？

angular.module('Bizcoin.loader')
.service('Loader', Loader);

function Loader($injector, $ocLazyLoad, User) {
  var Loader = {
    load: load,
    get: get,
    plugins: {},
    flags: {}
  };

  init();

  return Loader;

  function init() {
    load('vendors');
    if (userIsAdmin)
      load('admin');
  }

  function load(plugin) {
    Loader.plugins[plugin] = Loader[plugin] || $ocLazyLoad.load('path/to/'+plugin+'.js');
    return Loader.plugins[plugin].then(setFlag);

    function setFlag() {
      return Loader.flags[plugin] = true;
    }
  }

  function get(plugin) {
    return load(plugin).then(function() {
      return $injector.get(plugin);
    });
  }

}