Как установить зависимости пакета Bower?

Я создаю пакет Bower с именем X, который зависит от angular-local-storage. Я сохранил angular-local-storage в своем bower.json.

Мой модуль объявлен как: angular.module('X', ['LocalStorageModule']);

Услуга как:

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

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

Когда я устанавливаю пакет X с Bower в другом проекте, LocalStorageModule не найден.

Как я могу управлять этими зависимостями?

РЕДАКТИРОВАТЬ: ошибка:

Unknown provider: LocalStorageServiceProvider <- LocalStorageService <- XService


package angularjs bower
person Gura    schedule 18.03.2016    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Чтобы собрать пакет 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 и добавить его в созданный файл (используя инструмент сборки):

    а. пример с 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. установить беседку

  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)

Я надеюсь, что это краткое руководство поможет.

person Wassim Chegham    schedule 18.03.2016

arrow_upward
2
arrow_downward

  • Добавьте «LocalStorageModule» в список зависимостей основного модуля.
  • Включите angular-local-storage.js (или angular-local-storage.min.js) из каталога dist в ваш index.html после включения самого Angular.

Еще

Я бы посоветовал вам расположить свой завод или сервис следующим образом:

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

У него больше шаблонов, чем вам абсолютно необходимо, но он безопасен для минимизации и поддерживает чистоту ваших пространств имен.

person que1326    schedule 18.03.2016
comment
LocalStorageModule находится в основном списке, и у меня все еще есть ошибка, когда я добавляю директиву в представление. (библиотека также включена в index.html) И я только что заметил, что директива включает index.html, поэтому угловые зависимости устанавливаются два раза: WARNING: Tried to load angular more than once. - person Gura; 18.03.2016
comment
когда вы установили этот модуль, Bower попросил вас обновить некоторые зависимости с помощью ! (стойкость) ? покажи мне bower.json и index.html - person que1326; 18.03.2016