咕噜声从一个数据文件中汇集多个文件 [英] grunt assemble multiple files from one datafile
本文介绍了咕噜声从一个数据文件中汇集多个文件的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图用一个模板和一个数据文件组装多个文件
data.json
<$ p
site：{
title：博客，
作者：Jon Schlinkert
}，$ p $
pages：[
{
metadata：{
title：Blog Post＃1，
summary：，
categories：[]，
layout：post.hbs，
gists：[5898072]
}，
内容：这会传递给`body`标签，但如果您只需要从主要内容添加帖子，则不需要。
$ b $元数据$ {
title：Blog Post＃2，
summary：，
bages：[]，
，
{
metadata：{
title：Blog Post＃3，
summary：，
categories：[ ]，
layout：post.hbs，
gists：[5909393]
}
}
]
}
template.hbs
<！DOCTYPE html>
< html lang =en>
< head>
< meta charset =UTF-8>
< title> {{site.title}}< / title>
< link href =http://libs.github.io/bootstrap/css/bootstrap.min.css =stylesheet>
< meta name =authorcontent ={{site.author}}>
< / head>
< body>
{{#each gists}}
{{gist this}}
{{/ each}}
{{> body}}
< script src =http://libs.github.io/bootstrap/css/bootstrap.min.js>< / script>
< / body>
< / html>
我想我的grunt文件没有设置正确：
module.exports = function（grunt）{
//项目配置。
grunt.initConfig（{
assemble：{
pages：{
options：{
flatten：true，
data：'./src/data /data.json'
}，
文件：[
//当前我们需要咕and一声，并将这些页面文件组装成正确的
//使用此模式的地方
{dest：'./dist/'，src：'./src/templates/template.hbs'}
]
}
}，
clean： {
options：{force：true}，
all：['./dist/*.html']
}
}）;
grunt.loadNpmTasks（'grunt-assemble'）;
grunt.loadNpmTasks（'grunt-contrib-clean'）;
grunt.registerTask（'default'，['clean'，'assemble']）;
};
这个问题具有诱人的线索，但我无法弄清楚如何适应：
<使用汇编，从多个数据生成HTML文件使用一个模板文件的文件？
我相信这个问题在这里
https://github.com/assemble/assemble/issues/184
解决方案
我终于明白了：
Gruntfile.js
module.exports = function（grunt）{
//项目配置。
grunt.initConfig（{
data：grunt.file.readJSON（'src / data / data.json'），
assemble：{
inline_pages：{
选项：{
layout：./src/templates/post.hbs，
site：{
title：博客，
作者：Jon Schlinkert
}，
pages：'<％= data.pages％>'
}，
files：{
'dist /'：['！*' ]
}
}
}，
clean：{
options：{force：true}，
all：['./dist/*。 html']
}
}）;
grunt.loadNpmTasks（'grunt-assemble'）;
grunt.loadNpmTasks（'grunt-contrib-clean'）;
grunt.registerTask（'default'，['clean'，'assemble']）;
};
data.json
{
pages：[
{
filename：post1，
data：{
title： Blog Post＃1，
gists：[5898072]
}，
content：这会传递到`body`标签，但没有必要如果你只需要从一个要点添加一篇文章。
$ filename $ $ $ $ $ b $ title $ 2 $ Blog $＃ bgists：[5898077，5898078]
}
}，
{
文件名：post3，
data： {
title：Blog Post＃3，
gists：[5909393]
}
}
]
}
post.hbs
<！DOCTYPE html>
< html lang =en>
< head>
< meta charset =UTF-8>
< title> {{site.title}}< / title>
< link href =http://libs.github.io/bootstrap/css/bootstrap.min.css =stylesheet>
< meta name =authorcontent ={{site.author}}>
< / head>
< body>
页面标题为{{{this.title}}}
要点编号为{{{this.gists}}}
这是主体：
{{> body}}
< script src =http://libs.github.io/bootstrap/css/bootstrap.min.js>< / script>
< / body>
< / html>
I am trying to assemble multiple files using one template and one data file
data.json
{
"site": {
"title": "A Blog",
"author": "Jon Schlinkert"
},
"pages": [
{
"metadata": {
"title": "Blog Post #1",
"summary": "",
"categories": [""],
"layout": "post.hbs",
"gists": ["5898072"]
},
"content": "This would get passed into the `body` tag, but it's not necessary if you only need to add a post from a gist."
},
{
"metadata": {
"title": "Blog Post #2",
"summary": "",
"categories": [""],
"layout": "post.hbs",
"gists": ["5898077", "5898078"]
}
},
{
"metadata": {
"title": "Blog Post #3",
"summary": "",
"categories": [""],
"layout": "post.hbs",
"gists": ["5909393"]
}
}
]
}
template.hbs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{site.title}}</title>
<link href="http://libs.github.io/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<meta name="author" content="{{site.author}}">
</head>
<body>
{{#each gists}}
{{gist this}}
{{/each}}
{{> body }}
<script src="http://libs.github.io/bootstrap/css/bootstrap.min.js"></script>
</body>
</html>
I think I just don't have my grunt file set up correctly:
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
assemble: {
pages: {
options: {
flatten: true,
data: './src/data/data.json'
},
files: [
// currently we need to trick grunt and assemble into putting the pages file into the correct
// place using this pattern
{ dest: './dist/', src: './src/templates/template.hbs' }
]
}
},
clean: {
options: { force: true },
all: ['./dist/*.html']
}
});
grunt.loadNpmTasks('grunt-assemble');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask('default', ['clean', 'assemble']);
};
This question has tantalising clues but I couldn't figure out how to adapt: Using Assemble, generate HTML files from multiple data files using one template file?
I believe the functionality was created after this issue here https://github.com/assemble/assemble/issues/184
解决方案
I finally figured it out:
Gruntfile.js
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
data : grunt.file.readJSON('src/data/data.json'),
assemble: {
inline_pages: {
options: {
layout: "./src/templates/post.hbs",
site: {
title: "A Blog",
author: "Jon Schlinkert"
},
pages: '<%= data.pages %>'
},
files: {
'dist/': ['!*']
}
}
},
clean: {
options: { force: true },
all: ['./dist/*.html']
}
});
grunt.loadNpmTasks('grunt-assemble');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask('default', ['clean', 'assemble']);
};
data.json
{
"pages": [
{
"filename": "post1",
"data": {
"title": "Blog Post #1",
"gists": ["5898072"]
},
"content": "This would get passed into the `body` tag, but it's not necessary if you only need to add a post from a gist."
},
{
"filename": "post2",
"data": {
"title": "Blog Post #2",
"gists": ["5898077", "5898078"]
}
},
{
"filename": "post3",
"data": {
"title": "Blog Post #3",
"gists": ["5909393"]
}
}
]
}
post.hbs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{site.title}}</title>
<link href="http://libs.github.io/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<meta name="author" content="{{site.author}}">
</head>
<body>
The page title is {{{this.title}}}
The gist number is {{{this.gists}}}
This is the body:
{{> body}}
<script src="http://libs.github.io/bootstrap/css/bootstrap.min.js"></script>
</body>
</html>
这篇关于咕噜声从一个数据文件中汇集多个文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
