生成具有相同布局的不同把手页面

时间:2019-01-20 23:16:12

标签: javascript templates gulp handlebars.js partials

我的车把模板有问题,希望您能帮我整理一下。我需要生成不同的页面,每个页面包含不同的部分。但是,它们共享相同的HBS布局。 这些是我正在使用gulp运行的功能。 作为编译器,我正在使用“ gulp-compile-handlebars”

function createPages() {
    if (fs.existsSync(dir.pages)) {
        fileList = getFiles(dir.pages);
        let pages = []
        for(let i = 0; i < fileList.length; i++) {
            pages.push(
                gulp.src('src/pages/' + fileList[i])
                    .pipe(handlebars(contentData, {
                        ignorePartials: true,
                        helpers: helpers,
                        batch: ['src/partials']
                    }))
                    .pipe(rename(function(path){
                        path.extname = ".hbs"
                    }))
                    .pipe(gulp.dest('_tmp/' + i))
            )
        }
        return merge(pages)
    }
}

function createViews() {
    let views = []

    for(let j = 0; j < fileList.length; j++) {
        let fileName = fileList[j].split('.').slice(0,-1).join()
        let view = gulp.src('src/layouts/*.hbs')
            .pipe(handlebars(contentData, {
                partials: {
                    body: require('./_tmp/' + j + '/' + fileName + '.hbs')
                }
            }))
            .pipe(rename(fileName + ".html"))
            .pipe(gulp.dest('dist'))
        views.push(view)
    }
    return merge(views)
}

第一个是针对每个页面的页面,它使用帮助程序和部分编译内容,并将它们移动到_tmp文件夹中。我可以保证这些新生成的页面的内容彼此不同(这是我想要的)。

第二个方法是尝试获取布局文件,并且对于我拥有的每个页面,都将其“ body”部分注入页面本身。但是,生成的是内容相同的不同页面。我认为问题出在代码的这一部分

.pipe(handlebars(contentData, {
                partials: {
                    body: require('./_tmp/' + j + '/' + fileName + '.hbs')
                }
            }))

因为感觉即使它是动态创建的,也不允许我使用相同名称的两个不同部分。关于如何解决这个问题有什么建议吗?

仅供参考,这是layout.hbs

...
    <body>
        {{> body }}
    </body>

0 个答案:

没有答案