使用grunt从几个mustache部分模板中生成一个静态的html页面
我有一个nodejs单页面应用程序，它使用了几个mustache部分模板。 实际上，我并没有使用胡须填充数据，只是将HTML片段拼接到一个HTML文件中。 我已经尝试使用grunt-mustache-render插件来将我的index.mustache模板和所有partials渲染成一个单一的静态html文件，但是这些partials没有被拉入。一些重要的注释：并非所有的partials都在相同的目录，以及其他部分（zoinks !!!）。 而我的模板不是那些花哨的<脚本types=“文本/模板”>，只是直线上的HTML（我切换到淘汰赛数据绑定，如果你想知道为什么）。 以下是创buildbuild / index.html，但部分模板没有插入到HTML中。 我甚至使用正确的咕噜插件？ 这可能吗？ 任何帮助是极大的赞赏！ TIA！
Gruntfile.js
module.exports = function(grunt){ require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks); grunt.initConfig({ pkg: grunt.file.readJSON('package.json') mustache_render: { options: { directory: [ 'app/header/header.mustache', //header will pull in app/user/user.mustache 'app/footer/footer.mustache' ] }, your_target: { options: { directory: [ 'app/header/header.mustache', 'app/footer/footer.mustache' ] }, files : [ { data: 'data/properties.json', template: 'app/index/index.mustache', dest: 'build/index.html' }] }, } }); grunt.registerTask('default', ['mustache_render']); }; 应用程序/索引/ index.mustache
<!DOCTYPE html> <html> <head> <title>Mustache Test</title> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no"/> </head> <body> <div id="container"> {{> app/header/header.mustache}} <div class="content">some content would probably go here in a real example.</div> {{> app/index/footer/footer.mustache}} </div><!-- /#container --> </body> </html>
应用程序/标头/ header.mustache
<header> <img class="logo" src="logo.png" /> {{> app/user/user.mustache }} </header>
应用程序/用户/ user.mustache
<div class="user"> logged in as <a href="/profile">snotmonkey</a> | <a href="/logout">logout</a> </div>
应用程序/页脚/ footer.mustache
<footer> © 2014 Snotmonkey Corporation </footer>