grunt-angular-templates缓存所有模板

Question

所以当我尝试在我的angular应用程序中使用toastr作为全局错误通知系统时，我遇到了一个问题。这被记录为angular-toastr的问题，建议的解决方案是将所有模板推送到模板缓存中。显然，这是一件很好的事情，在阅读了为什么之后，我不得不同意。

我的问题是我真的是个新手(今天才安装)，虽然我现在已经成功地设置了我的gruntfile.js并运行了一些任务(缩小，拼接等)，但使用grunt-angular-templates对我来说还是一个谜。

我已经这样设置了我的gruntfile：

ngtemplates: {
    options: {
        module: 'project',
    },
    dist: {
        src: [
            'wwwroot/lib/angular-toastr/**.html'
        ],
        dest: 'wwwroot/js/templates.js'
    }
}

但是我生成的模板文件是空的。我认为这是因为脚本是在JS文件中创建的。有人知道如何访问它们以便将它们添加到缓存中吗？

Answer 1

我猜你的源文件没有被“看到”。这适用于我的以下配置，我使用了类似的结构，其中输出位于lib/文件夹中。我还使用了cwd (源目录选项)。确保在执行grunt任务之前将模板复制到wwwroot文件夹中。我还有其他一些繁琐的任务，可以‘清理’wwwroot/lib文件夹，所以我将源代码html(s)存储在另一个文件夹中。如果你不这样做，这也可能会有所帮助。

如果所有其他方法都失败了，那么在verbose -V中运行(就像alex所说的)。任务源文件位于以下位置。您还可以在此文件中添加额外的调试，以进一步排除故障。

node_modules\grunt-angular-templates\tasks\angular-templates.js

this.files.forEach(function(file) {
  if (!file.src.length) {
    grunt.log.warn('No templates found');
  }

这是我们使用的设置。

项目结构

来源

项目/资产/模板/admin/partials/(此处为html文件)

输出

project/wwwroot/lib/template(这里是html文件)

Grunt任务

   ngtemplates:  {
        app:        {
            cwd:      'assets/templates',
            src:      '**/partials/*.html',
            dest: 'assets/templates/partials.js',
            options: {
                module: 'cms.admin'
            }
        }
    },

输出将生成

angular.module('cms.admin').run(['$templateCache', function($templateCache) {
  'use strict';

  $templateCache.put('Admin/partials/navmenu.template.html',
    "<nav class=\"navbar navbar-default navbar-fixed-top\">\r" +
    "</nav>"
  );

}]);

Answer 2

您的问题可能出在src上: wwwroot/lib/angular-toastr/**.html

也许你可以试着使用这个grunt插件，它很容易使用，而且可以做同样的事情。https://github.com/karlgoldstein/grunt-html2js

grunt.initConfig({
  html2js: {
    options: {
      // custom options, see below
    },
    main: {
      src: ['src/**/*.tpl.html'],
      dest: 'tmp/templates.js'
    },
  },
})

Answer 3

尝试像这样单独运行任务: grunt -v。-v参数代表详细模式。您应该获得已读取的文件名。如果没有正在读取的文件，则可能存在文件路径问题。