4

提前感谢您的时间和帮助。

我正在尝试使用 grunt-contrib-handlebars 预编译把手(.hbs)模板

当我运行运行任务时,我最终得到了这个:

this["JST"] = this["JST"] || {};

this["JST"]["app/templates/err.hbs"] = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {
  this.compilerInfo = [4,'>= 1.0.0'];
helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
  var buffer = "", stack1, functionType="function", escapeExpression=this.escapeExpression;


  buffer += "<div>Error: ";
  if (stack1 = helpers.error) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
  else { stack1 = depth0.error; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
  buffer += escapeExpression(stack1)
    + "</div>";
  return buffer;
  });

但是,如果我从终端运行 npm 车把模块,我会得到:

(function() {
  var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
templates['err.hbs'] = template(function (Handlebars,depth0,helpers,partials,data) {
  this.compilerInfo = [4,'>= 1.0.0'];
helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
  var buffer = "", stack1, functionType="function", escapeExpression=this.escapeExpression;


 buffer += "<div>Error: ";
 if (stack1 = helpers.error) { stack1 = stack1.call(depth0, {hash:{},data:data}); }
 else { stack1 = depth0.error; stack1 = typeof stack1 === functionType ? stack1.apply(depth0) : stack1; }
 buffer += escapeExpression(stack1)
   + "</div>";
 return buffer;
 });
})();

第二个编译模板(从终端运行)在我的应用程序中正常工作 - 但 grunt 创建的模板不能。有人可能会指出我在这里可能做错的事情的正确方向吗?

我的 gruntfile 看起来像这样:

handlebars:
       options:
                wrapped: true
       compile:
                files: 'www/js/templates.js': ['app/templates/*.hbs']

再次感谢你的帮助!

4

2 回答 2

1

事实证明,这是由于使用不同版本的 Handlebars 导致的问题,其中 grunt-contrib-handlebars 版本与全局安装的 handlebars npm 模块不同。

于 2015-10-02T14:42:50.697 回答
0

您还可以使用函数作为“processName”并在 Gruntfile 中指定一个“命名空间”,例如,如果您article_snippet.handlebars在一个名为的文件夹中只有一个文件,handlebars则可以执行以下操作:

    handlebars: {
      compile: {
        options: {
          namespace: 'Handlebars.templates',
          processName: function(filename) {
              var name = filenaname.split('/')[1].split('.');
              return name[0];
          },
          wrapped: true,
          commonjs: null
        },
        files: {
          "js/articles/templates.js": "handlebars/article_snippet.handlebars",
        }
      }
    },

grunt-contrib-handlebars 文档中获取灵感

于 2016-01-26T09:38:18.250 回答