如何使用koa-views + handlebars渲染主布局和局部视图?

Lan*_*nti 3 javascript handlebars.js koa

这是我的views文件夹结构:

- views
  - layouts
      layout.hbs
  - partials
      part.hbs
  home.hbs
Run Code Online (Sandbox Code Playgroud)

我正在渲染模板的宽度:

app.use(views(__dirname + '/views', {
  extension: 'hbs',
  map: { hbs: 'handlebars' }
}));

router.get('/', async (ctx) => {
  await ctx.render('home', {
    Name: 'Iris',
    Type: 'Web',
    Path: '/'
  });
});
Run Code Online (Sandbox Code Playgroud)

我想要的是定义主布局文件和partials文件夹,就像它位于中一样express-handlebars。真的没有办法用koa-viewspure 做到这一点handlebars吗?

我必须使用koa-hbs还是koa-handlebars?但是他们使用了即将弃用的功能(以及Handlebars v2.0.0,v3.0.0):

koa deprecated Support for generators will been removed in v3.
See the documentation for examples of how to convert old middleware
https://github.com/koajs/koa/tree/v2.x#old-signature-middleware-v1x app.js:45:5
Run Code Online (Sandbox Code Playgroud)

编辑:

好像koa-hbskoa-handlebars插件不兼容koa v2。因此,有没有办法使用koa v2partialslayouts与呈现handlebars的那一刻?:(没有这些(define layoutspartialshandlebars是没有用的。所以仍然卡在express...

小智 5

koa-hbs实际上只是.registerPartial在引擎盖下使用把手。

尽可能基本:

var handlebars = require('handlebars'),
    fs = require('fs')

handlebars.registerPartial(
    'defaultLayout',
    fs.readFileSync(__dirname + '/views/layouts/default.html', 'utf8')
)

// then continue with loading the application...
Run Code Online (Sandbox Code Playgroud)

但是,您可能只想在启动时加载整个partials文件夹的便利性。

  1. 创建一个Promise,并执行一个函数,该函数读取您的partials文件夹,并通过注册每个局部handlebars.registerPartial。它们全部注册后,它应该解决Promise。
  2. 创建一个等待解决该Promise的中间件异步,以便您的应用在注册这些部分之前不会呈现任何视图

这是我使用的示例:

var fs = require('fs'),
    handlebars = require('handlebars'),
    glob = require('glob'), // for convenience, npm install glob
    path = require('path')

function readAsPromise (path) {
    return new Promise(function (resolve, reject) {
        fs.readFile(path, 'utf8', function (err, data) {
            resolve({path: path, data: data})
        })
    })
}

function registerPartial (partial) {
    var partialName = path.basename(partial.path, '.hbs')

    handlebars.registerPartial(partialName, partial.data)
}

var loadPartials = new Promise(function (resolve, reject) {

    glob('./views/partials/*.hbs', function (err, files) {
        Promise.all(files.map(readAsPromise)).then(function (partials) {
            partials.forEach(registerPartial)
            resolve()
        })
    })

})
Run Code Online (Sandbox Code Playgroud)

现在的问题是您使用的是哪个版本的Koa

// koa 1

app.use(function* (next) {
    yield loadPartials
    yield next
})

// latest koa

app.use(async (ctx, next) => {
  await loadPartials
})
Run Code Online (Sandbox Code Playgroud)

现在,只需像往常一样在车把中使用偏线即可。这适用于需要相同把手实例的koa-views