我正在尝试为服务器中编译的把手创建自定义帮助程序。 我尝试过这种方法:How to precompile gulp-handlebars helpers?
如果我使用内部gulp-handlebars记录把手的版本,我会得到这个:
helpers: { blockHelperMissing: [Function],
each: [Function],
helperMissing: [Function],
if: [Function],
unless: [Function],
log: [Function],
lookup: [Function],
with: [Function],
multiply: [Function] },
所以我看到'鞋面'这是我插入的助手。但是在客户端,我要么
未捕获错误:缺少助手:上方
或者如果我使用符号\{{upper string}}
它不起作用。谁能帮我?也许我错过了什么。
这是我的helpers.js:
// helpers.js
var handlebars = require('handlebars');
handlebars.registerHelper('multiply', function(a,b){
return a*b;
});
module.exports = handlebars;
这是我的gulpfile.js
'use strict';
var gulp = require('gulp');
var sass = require('gulp-sass');
var wrap = require('gulp-wrap');
var declare = require('gulp-declare');
var concat = require('gulp-concat');
var gulp = require('gulp');
var handlebars = require('gulp-handlebars');
var handlebarsh = require('./app/lib/helpers.js');
gulp.task('sass', function () {
gulp.src('./public/client/scss/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./public/client/css'));
});
gulp.task('sass:watch', function () {
gulp.watch('./public/client/scss/**/*.scss', ['sass']);
});
gulp.task('templates', function(){
gulp.src('app/assets/client/templates/modules/*.hbs')
.pipe(handlebars({
handlebars: handlebarsh,
}))
.pipe(wrap('Handlebars.template(<%= contents %>)'))
.pipe(declare({
namespace: 'Orochi.templates',
noRedeclare: true, // Avoid duplicate declarations
}))
.pipe(concat('templates.js'))
.pipe(gulp.dest('public/client/assets/templates/js/'));
});
gulp.task('watch',['templates'], function () {
gulp.watch('app/assets/client/templates/modules/*.hbs' , ['templates']);
gulp.watch('./public/client/scss/**/*.scss', ['sass']);
});
和模板:
<div class="row">
<div class="animals-wrapper">
{{#each labels}}
<div class="animal-wrapper" animal="{{@index}}">
<div class="animal-image" style="'background-position: ' {{multiply 2 2}}'px 0px;'"></div>
<div class="animal-label"></div>
</div>
{{/each}}
</div>
</div>