Question

我的把手预编译模板中出现了typeError

查看stackoverflow后，问题似乎与任务编译器和把手版本之间的兼容性问题有关。

这是我的车把版本：

$ handlebars -v 2.0.0

$ handlebars postlist.hbs | grep“编译器” }，“编译器”：[6，“＆gt; = 2.0.0-beta.1”]

浏览器输出：handlebars.compiler_version是6

我猜这可能是我的问题，但不知道如何升级我的编译器以降低测试版。（？）[这不应该成为两个问题之后的问题]

我的grunt任务不会抛出任何错误并创建文件：

$ grunt handlebars：compile

运行“把手：编译”（把手）任务

创建了1个文件。

完成，没有错误。

这是我的oneline js：var template = Handlebars.templates ['postlist'];

这是我在console.log中遇到的错误未捕获的TypeError：无法读取未定义的属性'postlist'。

请帮忙！

这是我的咕噜文件：

(function(){
  'use strict';
  module.exports = function(grunt) {

    // Global Vars
    var _globalConfig = {
      lessDir: '_less/',
      cssDir: 'css/',
      jsDir: 'js/',
      iconsDir: 'assets/icoMoon/SVG/',
      templateDir: 'temptpl/'
    };

    // Project configuration.
    grunt.initConfig({
      // Global Vars
      _globalConfig: _globalConfig,
      pkg: grunt.file.readJSON('package.json'),  

      // File Includes, https://github.com/vanetix/grunt-includes
      // TODO: set this up.
      includes: {
        files: {
          src: ['path/to/foo.html', 'path/to/bar.html'], // Source files
          dest: 'tmp', // Destination directory
          flatten: true,
          cwd: '.',
          options: {
            silent: true,
            banner: '<!-- Include File Location: <% includes.files.dest %> -->'
          }
        }
      },
      // Suit CSS Preprocessor
      suitcss: {
        options: {
          // Task-specific options go here.
          conform: false
        },
        your_target: {
          files: {
            '<%= _globalConfig.cssDir %><%= pkg.name %>-suit.dev.css': ['<%= _globalConfig.cssDir %>lib/site.css','<%= _globalConfig.cssDir %>lib/*.css'],
          }
        }
      },
      // Static Web Server
      nodestatic: {
        server: {
          options: {
            port: 9009
          }
        }
      },
      svgmin: {
        options: {
          plugins: [
            {
              removeViewBox: false
            }, {
              removeUselessStrokeAndFill: false
            }, {
              cleanupIDs: false
            }
          ]
        },
        dist: {
          files: {
            'img/svg-icons.min.svg': 'img/svg-icons.svg'
          }
        }
      },
      svgstore: {
        options: {
          prefix: 'Icon-',
          cleanup: ['fill','viewbox']
        },
        default: {
          files: {
            'img/svg-icons.svg': ['<%= _globalConfig.iconsDir %>*.svg'],
          },
        },
      },
      // Less Compiler
      less: {
        options: {
          ieCompat: true,
          sourceMap: true,
          sourceMapBasepath: '_less',
          outputSourceFiles: true
        },
        dev: {
          files: {
            '<%= _globalConfig.cssDir %><%= pkg.name %>.css': '<%= _globalConfig.lessDir %><%= pkg.name %>.less'
          }
        }
      },
      handlebars: {
        compile: {
          files: {
            // "<%= _globalConfig.jsDir %>lib/_templates.js": ['<%= _globalConfig.templateDir %>*.hbs']
            "<%= _globalConfig.jsDir %>temptpl.js": ['<%= _globalConfig.templateDir %>*.hbs']
          }
        }
      },
      watch: {
        css: {
          // Watches LESS file changes then triggers LESS compile
          files: ['<%= _globalConfig.lessDir %>**/*.less'],
          tasks: ['less:dev',]
        },
        suit: {
          // Watches Site CSS file for changes then passes to Suit-CSS preprocessor
          files: ['<%= _globalConfig.cssDir %><%= pkg.name %>-suit.css','<%= _globalConfig.cssDir %>lib/*.css'],
          tasks: ['suitcss']
        },
        svg: {
          files: ['<%= _globalConfig.iconsDir %>*.svg'],
          tasks: ['svgstore','svgmin']
        },
        hbs: {
          files: ['<%= _globalConfig.templateDir %>*.hbs'],
          tasks: ['handlebars']
        }
        // js: {
        //   files: ['<%= _globalConfig.jsDir %>**/*.js'],
        //   tasks: ['import:dev']
        // },
        // svg: {
        //   files: ['<%= _globalConfig.iconsDir %>*.svg'],
        //   tasks: ['svgstore','svgmin']
        // }
      },

    });

    // Load Plugins Found in package.json
    require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);

    // Grunt Tasks
    grunt.registerTask('prepsvg',['svgstore','svgmin']);
    grunt.registerTask('suitup',['watch:suit']);
    grunt.registerTask('default', ['watch']);

  };
}());

Answer 1

在这里找到答案：https://github.com/gruntjs/grunt-contrib-handlebars/issues/60

handlebars: {
    compile: {
        files: {
            "public/js/templates/templates.js": "public/js/templates/*.hbs"
        },
        options: {
            namespace: 'Handlebars.templates',
            processName: function(filePath) {
                var pieces = filePath.split("/");
                return pieces[pieces.length - 1].replace('.hbs', ''); 
                }
        }
    }
}

把手预编译类型错误

1 个答案: