2016-08-02 168 views
3

這是我的觀點的文件夾結構:如何使用koa-views +把手渲染主佈局和局部區域?

- views 
    - layouts 
     layout.hbs 
    - partials 
     part.hbs 
    home.hbs 

我渲染模板寬度:

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

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

我想是定義主要佈局文件和文件夾的諧音一樣,如果它在express-handlebars。真的有沒有辦法實現這個koa-views和純handlebars?我要使用koa-hbskoa-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 

編輯:

好像koa-hbskoa-handlebars插件與koa v2不兼容。所以目前沒有辦法使用koa v2,partialslayoutshandlebars呈現? :(沒有這些(定義layoutspartialshandlebars也沒用所以仍然express stucked ...

回答

3

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... 

但你可能想要的只是加載你的整個文件夾的諧音在啓動時雖然方便。

  1. 創建一個承諾,並具有讀取您的partials文件夾的函數執行,並通過handlebars.registerPartial註冊每個部分。它應該在全部註冊時解決諾言。
  2. 創建一箇中間件異步是等待這一承諾得到解決,那麼您的應用程序不提供任何看法的諧音被註冊

之前,下面是我用一個例子:

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() 
     }) 
    }) 

}) 

現在問題是你使用哪個版本的Koa

// koa 1 

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

// latest koa 

app.use(async (ctx, next) => { 
    await loadPartials 
}) 

現在只需在把手中使用partials即可。這可以很好地與koa視圖,這將需要相同的車把實例

+0

謝謝你的答案!我使用'koa v2'。 – Lanti