如何在AngularJS中将多个JS文件合并为一个文件？

Question

我有三个模块名称：'dashboard.services1', 'dashboard.services2', 'dashboard.services3'。

angular.module('dashboard.services1', [])

    .service('sublineService', function ()

那3个服务是.js（angular）文件。我想将这些文件添加到app.js中。

angular.module('dashboard', ['dashboard.filters', 'dashboard.services1', 
'dashboard.services2', 'dashboard.services3', 'dashboard.directives', 
'dashboard.controllers']).
      config(['$routeProvider', function ($routeProvider, $routeParams) {
          // Dashboard Screens
          $routeProvider.when('/lines', 
{ templateUrl: 'partials/lines.html', controller: 'PlantController' });
          $routeProvider.when('/lineId/:lineId/linename/:linename', 
{ templateUrl: 'partials/line-detail.html', controller: 'LineDetailController' });
          $routeProvider.when('/subline/:lineId/:sublineId', 
{ templateUrl: 'partials/subline-detail.html', controller: 'SublineController' });
          $routeProvider.when('/equipment/:equipmentId', 
{ templateUrl: 'partials/equipment-detail.html', controller: 'EquipmentController' });
     $routeProvider.otherwise({ redirectTo: '/lines' });
      }]);

但是我的问题是这三个文件都无法工作。最后一个文件即：

 'dashboard.services3'

只有这些文件能工作并输出内容，其他两个文件被跳过了。我不知道我的问题出在哪里。

我的问题是如何添加更多的服务文件（即模块名称）/ 如何将这些模块名称合并到单个 .js（angular）文件中，以便获取所有想要工作并获得输出的脚本文件。

谢谢！

- kasim

Answer 1

angular.module() 不接受文件名，而是接受模块名。Angular不会为您从服务器加载脚本，它期望在引导应用程序之前您已经加载了脚本文件。

您有几个选项：

• 在html中手动使用

- Daniel Tabuenca

---

我只添加了JS文件的模块名称。不是文件名，即“dashboard.services1”（模块名称）angular.module('dashboard.services1', []) .service('sublineService', function () - kasim

是的，但是Angular不会加载任何文件。在Angular中根本没有任何代码会从服务器加载任何脚本。您必须事先自己加载它，然后Angular才能注册您传递的模块名称。 - Daniel Tabuenca

那我需要做什么才能得到这个？请提供您了解的有关组合和加载这三个模块的示例。 - kasim

只需使用<script src="filename.js"></script>标签加载它们即可。除非您有很多文件或想要进行生产优化/最小化，否则不需要合并。如果您确实需要，请查看我的答案中的链接。 - Daniel Tabuenca