0
我想預編譯我的車把模板Home.hbs，但它給了我一個錯誤，說不能讀取未定義的屬性「模板名稱」。Handlebar.templates是undefined
這裏是索引文件
<!DOCTYPE html>
<html lang="en">
<link>
<meta charset="UTF-8">
<title>Title</title>
<link href="dist/styles/libs/bootstrap.css"/>
<link href="dist/styles/app.css"/>
</head>
<body>
<div class="wrapper">
<h1>This is the home page</h1>
</div>
</body>
<script src="dist/js/thirdparty.js"></script>
<script src="dist/js/templates.js"></script>
<script src="dist/js/main.js"></script>
</html>
我使用的是一飲而盡，車把任務預編譯
var config ={
handlebar: {
path: 'app/templates/pages/**/*.hbs',
dist: 'dist/js',
partials: 'app/templates/partials/**/*.hbs'
}
}
gulp.task('handlebar', function(){
gulp.src(config.handlebar.path)
.pipe(handlebars())
.pipe(wrap('Handlebars.template(<%= contents %>)'))
.pipe(declare({
namespace: 'RRI.templates',
noRedeclare: true, // Avoid duplicate declarations
}))
.pipe(concat('templates.js'))
.pipe(gulp.dest(config.handlebar.dist));
});
Home.hbs
<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>
<div class="wrapper">
<h2>Hello World!! </h2>
{{> _search}}
</div>
_search.hbs
<h1>search</h1>
main.js
$(document).ready(function() {
var template = Handlebars.templates.RRI.templates.Home;
var context = {title: "My New Post", body: "This is my first post!"};
var html = template(context);
$(".wrapper").append(html);
});
它給了我一個錯誤在main.js說看不懂的未定義的屬性RRI第二行。
template.js文件
this["RRI"] = this["RRI"] || {};
this["RRI"]["templates"] = this["RRI"]["templates"] || {};
this["RRI"]["templates"]["Home"] = Handlebars.template({"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {
var stack1, helper, alias1=helpers.helperMissing, alias2="function", alias3=this.escapeExpression;
return "\r\n\r\n<div class=\"entry\">\r\n <h1>"
+ alias3(((helper = (helper = helpers.title || (depth0 != null ? depth0.title : depth0)) != null ? helper : alias1),(typeof helper === alias2 ? helper.call(depth0,{"name":"title","hash":{},"data":data}) : helper)))
+ "</h1>\r\n <div class=\"body\">\r\n "
+ alias3(((helper = (helper = helpers.body || (depth0 != null ? depth0.body : depth0)) != null ? helper : alias1),(typeof helper === alias2 ? helper.call(depth0,{"name":"body","hash":{},"data":data}) : helper)))
+ "\r\n </div>\r\n</div>\r\n\r\n<div class=\"wrapper\">\r\n <h2>Hello World!! </h2>\r\n"
+ ((stack1 = this.invokePartial(partials._search,depth0,{"name":"_search","data":data,"indent":" ","helpers":helpers,"partials":partials})) != null ? stack1 : "")
+ "</div>\r\n";
},"usePartial":true,"useData":true});
我用的車把3.0.1，請幫忙。