如何设置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

• 将“ LocalStorageModule”添加到主模块的依赖项列表中。
• 在包括Angular本身之后，将dist目录中的dist -local-storage.js （或angular-local-storage.min.js）包括在index.html中。

更多

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

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

这比您绝对需要的样板更多，但它具有缩小的安全性，并使名称空间保持整洁。

Answer 2

为了构建一个Bower软件包，您需要确保遵循以下步骤：

凉亭包：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文件并将其附加到构建的文件中（使用构建工具）：

   一种。 以咕unt声为例： https : //www.npmjs.com/package/grunt-angular-templates

   b。 以gulp为例： https ： //www.npmjs.com/package/gulp-angular-templatecache

4. 发布到凉亭

外部项目

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

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

2. 安装凉亭

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> 

   ==>或使用构建工具为您完成此任务（查找wiredep ）

希望本快速指南对您有所帮助。