如何设置bower包依赖项？

Question

我正在创建一个名为X的bower包，它依赖于angular-local-storage。 我将angular-local-storage保存在bower.json。

我的模块声明为： angular.module('X', ['LocalStorageModule']);

服务为：

angular
  .module('X')
  .service('XService', XService);

function XService($resource, $q, $window, LocalStorageService) {...}

当我在另一个项目中使用bower安装包X时，找不到LocalStorageModule。

如何管理此依赖项？

编辑：错误是：

Unknown provider: LocalStorageServiceProvider <- LocalStorageService <- XService

Answer 1

• 添加＆＃39; LocalStorageModule＆＃39;到主模块的依赖项列表。
• 在包含Angular本身后，在index.html的dist目录中包含 angular-local-storage.js （或angular-local-storage.min.js）。

更多

我建议您按照这种方式布置工厂或服务：

.service('ServiceName', ['$log','OtherService', function($log, OtherService){
   var serviceInstance = {};
   //stuff
   return serviceInstance;
}]);

这比你绝对需要的更多样板，但它是安全的缩小并保持你的命名空间干净。

Answer 2

为了构建凉亭包，您需要确保遵循以下步骤：

凉亭包：X

1. 使用以下（最小）配置准备bower.json：

   {
     "name": "your-package-x",
     "version": "1.0.0",
     "main": "dist/your-package-x.min.js",
     "dependencies": {
       "angular": "1.5.0",
       "angular-local-storage": "2.0.7"
       ...
     }
   }
   

2. 将所有软件包的文件构建到 dist / your-package-x.min.js （使用您最喜欢的构建工具）

3. 如果包具有HTML模板，则应构建templateCache文件并将其附加到构建文件（使用构建工具）：

   一个。以grunt为例：https://www.npmjs.com/package/grunt-angular-templates

   湾gulp例如：https://www.npmjs.com/package/gulp-angular-templatecache

4. 发布到凉亭

外部项目

1. 将 your-package-x 依赖项添加到您的bower.json：

   {
     "name": "main-project",
     "version": "1.0.0",
     "dependencies": {
       "your-package-x": "path to repo or version"
       ...
     }
   }
   

2. 安装bower deps

3. 注入package-x及其依赖项：

   <script src="bower_components/angular/angular.min.js"></script>
   <script src="bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script>
   <script src="bower_components/dist/your-package-x/dist/your-package-x.min.js"></script>
   

   ==＆GT;或使用构建工具为您完成（查找 wiredep ）

我希望这本快速指南会有所帮助。