解決koa2 ctx.render is not a function

最近在學習使用koa2,在嘗試用koa2複寫之前用express寫的一個入口文件的時候發現命令行報錯ctx.render is not a function
這裏寫圖片描述
項目路徑如下
這裏寫圖片描述
app.js是之前用express寫的入口文件
koa.js是用koa2複寫的入口文件
view是前端頁面文件夾,使用的模板引擎是pug
報錯時koa.js代碼如下

//使用koa複寫入口文件
const Koa = require('koa');
const Router = require('koa-router');
const koaBody = require('koa-body');
const views = require('koa-views');
const serve = require('koa-static');

const app = new Koa();
const router = new Router();

app.use(serve(__dirname));
app.use(koaBody()).use(router.routes());
app.use(views(__dirname + '/views/pages',{
    extension: 'pug'
}))

app.listen(3000);

router.get('/', async(ctx, next) => {
    await ctx.render("index",{
        title:"nodeWeb 首頁"
    })
});

其實這個bug很好解決,那就是把配置模板引擎的代碼移動到所有與路由相關的代碼之前,在這裏就應該修改爲

//使用koa複寫入口文件
const Koa = require('koa');
const Router = require('koa-router');
const koaBody = require('koa-body');
const views = require('koa-views');
const serve = require('koa-static');

const app = new Koa();
const router = new Router();

app.use(serve(__dirname));
//配置模板引擎
app.use(views(__dirname + '/views/pages',{
    extension: 'pug'
}))
//使用koa-router
app.use(koaBody()).use(router.routes());

app.listen(3000);

//設置路由
router.get('/', async(ctx, next) => {
    await ctx.render("index",{
        title:"nodeWeb 首頁"
    })
});

造成這個bug的原因是因爲中間件的執行是有順序的,路由在前,然後模板引擎在後的話,當執行到ctx.render的時候,模板引擎相關的中間件還未執行,render方法還未綁定到ctx上,所以就會報ctx.render is not a function

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章