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

Question

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

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

    .service('sublineService', function ()

这 3 个服务是 .js（角度）文件。我要添加的这些文件

应用程序.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' });
      }]);

但我的问题不适用于所有这 3 个文件。最后一个即

 'dashboard.services3'

只工作并从中获得输出。其他 2 个文件被跳过。我不想要是我的问题。

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

谢谢 ！

Answer 1

angular.module() 不采用文件名，它采用模块名称。Angular 不会为您从服务器加载脚本，它希望您在引导应用程序之前加载脚本文件。

你有几个选择：

• 在 html 中手动包含所有带有标签的脚本
• 使用无数脚本加载工具中的任何一种，例如 require.js、$script.js 等...

• 使用第三方工具将所有 javascript 文件合并到一个文件中，并可选择最小化/优化。您可以使用以下内容：

  • 谷歌闭包编译器：https ://developers.google.com/closure/compiler/
  • RequireJS 优化器：http ://requirejs.org/docs/optimization.html#wholeproject
  • 雅虎的 YUI 压缩器：http: //yui.github.io/yuicompressor/
  • Uglify.js：https ://github.com/mishoo/UglifyJS

然后，您需要使用 html 中的标签加载由这些工具之一生成的脚本。