Question

我正在研究在Laravel 5中开发的已经构建的系统。对于html，之前的开发人员使用了Backbone，但他使用了一些任务管理器。布局中只有两个JS文件。在一个文件中，他汇总了所有基本的必需js文件和骨干的所有JS文件。他将此文件命名为admin.js。他使用了另一个文件并使用了所有的html模板作为预编译的把手模板，并将其命名为admin_template.js。他只在整个系统中使用这两个js文件。我可以访问服务器代码，但是没有这样的文件可以指示他使用的是哪个构建系统。服务器上没有package.json。我猜他会在他的本地使用这些东西，并且从未将这些东西推送到任何存储库或服务器。

通过深入挖掘，我发现他已经使用过Grunt。我已经生成了admin.js文件，就像他已经生成了一样。对于模板，他使用了JST。我搜索过并找到一个grunt-contrib-handlebars。我已设法生成模板文件，但它与现有文件不是百分之百匹配。例如，这是现有文件的内容

  this["JST"] = this["JST"] || {};
  this["JST"]["admin/Modules/Base/Templates/InModalMessageTemplate.html"] = 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, helper, options, functionType="function", escapeExpression=this.escapeExpression, self=this, helperMissing=helpers.helperMissing;

  function program1(depth0,data) {

      var buffer = "", stack1, helper;
      buffer += "\n<div id=\"inModalMessageWrap\" class=\"bs-callout bs-callout-danger ";
      if (helper = helpers.type) { stack1 = helper.call(depth0, {hash:{},data:data}); }
     else { helper = (depth0 && depth0.type); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
     buffer += escapeExpression(stack1)
+ "\">\n";
   return buffer;
}

对于同一部分，请检查我的文件

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

 this["JST"]["./public/assets/js/admin/Modules/Base/Templates/InModalMessageTemplate.html"] = Handlebars.template({"1":function(container,depth0,helpers,partials,data) {
var helper;

  return "<div id=\"inModalMessageWrap\" class=\"bs-callout bs-callout-danger "
+ container.escapeExpression(((helper = (helper = helpers.type || (depth0 != null ? depth0.type : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : (container.nullContext || {}),{"name":"type","hash":{},"data":data}) : helper)))
+ "\">\n";
 },"3":function(container,depth0,helpers,partials,data) {
var helper;

  return "<div id=\"inModalMessageWrap\" class=\"bs-callout bs-callout-success "
+ container.escapeExpression(((helper = (helper = helpers.type || (depth0 != null ? depth0.type : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : (container.nullContext || {}),{"name":"type","hash":{},"data":data}) : helper)))
+ "\">\n";
}

检查前者1是否有function program1(depth0,data) {，但在我生成的1中则没有。在前一个1中，我们有像this.compilerInfo = [4,'>= 1.0.0'];这样的compilerInfo，在我生成的1中，它在某个地方丢失，在某些地方它就像{"compiler":[7,">= 4.0.0"]

当我尝试使用生成的文件运行项目时，它会显示

`TypeError: templateSpec.call is not a function`

我搜索了这个错误，它是关于车把版本问题。我已经安装了上述版本，但是这个错误不会出现在任何地方。这就是我的gruntfile的样子

 module.exports = function(grunt) {
var libFiles = [

    './public/assets/js/admin/Modules/**/*.js'
];
// Project configuration.
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    concat: {
        options: {
            stripBanners: true,
            banner: '/*! Compiled on: <%= grunt.template.today("mm-dd-yyyy") %> */' + '\n\n',
            separator: "\n",
            process: function (src, filepath) {
                return '// Source: '+filepath+'\n\n' + src+'\n'
            }

        },
        dist: {
            src: libFiles,
            dest: './public/assets/js/compiled/admin.js',
        },
    },
    handlebars: {
        compile: {
            options: {
                namespace: 'JST'
            },
            files: {
                './public/assets/js/compiled/my_template.js': ['./public/assets/js/admin/Modules/**/*.html']
            }
        }
    }
});

// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-concat');

grunt.loadNpmTasks('grunt-contrib-handlebars');
// Default task(s).
    grunt.registerTask('default', ['concat', 'handlebars']);

};

任何正文都可以让我知道如何解决此问题并生成预编译车把模板已存在的确切文件？

Answer 1

几件事：

首先在"compiler":[7,">= 4.0.0"] 7 是把手编译器版本，＆gt; = 4.0.0 表示在把手版本4期间引入了该编译器版本。最初的编译器有v = 4.编译器v 5带有把手2.0.0-alpha，这意味着你需要一些grunt-contrib-handlebars，它依赖于handelbars v小于2.根据发行说明 v0.8.0 是最后一个，取决于把手1.x. 这意味着您必须在package.json中降级预编译器，如："grunt-contrib-handlebars" : "=0.8.0"。或者您可以将运行时把手更新到最新版本，并希望预编译模板在浏览器中运行时没有错误，即使它们不再是旧版本。

然后你必须使名字相同。我想你可以在你的gruntfile的编译选项部分设置cwd，如：cwd: './public/assets/js/'或添加类似

的内容

processName: function(filePath) {
  return filePath.replace("./public/assets/js/", "");
},

选项，摆脱那部分。

第三：可能是项目使用了部分。它们在模板中看起来像{{> myPartialName}}，在这种情况下，如果它们也是文件，那么你需要将它们作为部分添加到你的grunt任务中。 partialRegex: /^myPartialName|^myOtherPartial.hbs$/,

Grunt Handlebar预编译器模板

1 个答案: