如何在控制台中报告 Angular 依赖项的导入模块错误答案

【问题标题】：How to report import module error in console for Angular dependency如何在控制台中报告 Angular 依赖项的导入模块错误
【发布时间】：2016-03-18 03:00:38
【问题描述】：

我正在编写一组 Angular 指令。其中一些将使用其他 3rd Angular 依赖项（例如ngFileUpload、ui-select）。目前我都这样声明：

angular.module('module1', ['ngFileUpload']) 
  .directive('MyDirective1NeedNgFileUpload', function() {
     // ...
  });

angular.module('module2', ['ui-select']) 
  .directive('MyDirective1NeedUiSelect', function() {
     // ...
  });

angular.module('myLibrary', ['module1', 'module2']);

通常，用户必须在一个真实的应用程序中包含三个 js 文件，如下所示：

<html>
<body>
  ...
  <script src="/path/to/ng-file-upload.js"></script>
  <script src="/path/to/ui-select.js"></script>
  <script src="/path/to/myLibrary.js"></script>
  <script src="app.js"></script>
</body>
</html>

// in app.js
angular.module('myapp', [
  'myLibrary', 
  'ngFileUpload',
  'ui-select'
]);

如果我只在应用程序 1 中使用module1，我根本不需要ui-select。但是我还是需要包含ui-select，否则浏览器会报错Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/...。

我想问/做的是，我想延迟加载第三个依赖项，只有在真正需要它们时，或者只是抛出关于缺少什么的更具体的错误消息。

这怎么可能？

【问题讨论】：

标签： javascript angularjs angularjs-directive dependencies

【解决方案1】：

因此，正如您所说，有些用户可能只需要 module1 功能，有些用户可能需要 module2 一些功能。

您也将库作为组合模块发布angular.module('myLibrary', ['module1', 'module2']);

由于 module1 和 module2 独立运行，请在您的文档中告知用户可以单独使用该模块或使用 myLibrary 组合功能。

angular.module('userApp', ['module1']);// in case single module is enough for user
angular.module('userApp', ['myLibrary']); // incase both module features will be used

【讨论】：

在我的真实案例中，我有一个指令<form-control>，它可以是输入、下拉列表、日期时间选择器或文件上传。如果用户从不使用文件上传，则不必包含ng-file-upload.js。如果用户从不使用下拉列表，则不必包含ui-select.js。想象一下有些库很大，我会想办法按需加载库。
感谢您的回复。我最初的描述可能会产生误导。我在原始问题中添加了更多细节。