Как упаковать мои угловые шаблоны с grunt и browserify

Question

Я использую angular1 с browserify а также grunt построить приложение. В настоящее время browserify только упаковывает контроллеры и выбирает шаблоны, используя ng-includeв отдельном вызове AJAX.

Из-за большого количества вызовов ajax я хочу упаковать шаблоны вместе с javascript. В настоящее время я использую grunt-processhtml включить вывод из browserify в моем html, Что мне нужно знать, это как я могу генерировать вывод, как

<script type="text/ng-template" id="/templates/*.html">
  # Template content
</script>

куда * подстановочный знак всех файлов внутри templates папку, и они содержат содержимое этого файла. Заранее спасибо за помощь.

Answer 1

Идея заключается в кешировании HTML-шаблонов с использованием сервиса Angular cache. Все шаблоны будут вставлены в файл JS и загружены как модуль Angular. Пример содержимого выходного файла:

angular.module('app').run(["$templateCache", function($templateCache) {
  $templateCache.put("home.html",
      '<h2>This is home page</h2>' // contents for home.html ... 
  );
});

Сначала установите плагин по этой ссылке:

https://www.npmjs.com/package/grunt-angular-templates

Затем загрузите в пух и прах:

 grunt.loadNpmTasks('grunt-angular-templates');

Наконец добавьте свою конфигурацию ngTemplate. Вот пример

ngtemplates:  {
  app:        {
    src:      '**.html',
    dest:     'template.js'
  }
}