阅读量:0
在 Koa 中使用模板引擎,你需要遵循以下步骤:
安装相关依赖:
首先,你需要安装 Koa 和相应的模板引擎。例如,这里我们使用
koa
和koa-views
(一个简单的模板引擎中间件)以及ejs
作为模板引擎。你可以通过 npm 或 yarn 安装它们:npm install koa koa-views ejs
或者
yarn add koa koa-views ejs
创建一个 Koa 应用:
在你的项目文件夹中,创建一个名为
app.js
的文件,并设置一个基本的 Koa 应用:const Koa = require('koa'); const app = new Koa(); // 其他中间件和设置 app.listen(3000, () => { console.log('Server is running on port 3000'); });
配置模板引擎:
在
app.js
中,引入koa-views
和你选择的模板引擎(在这里是ejs
),然后将它们添加到 Koa 应用中。你还需要指定模板文件的路径和模板引擎类型:const Koa = require('koa'); const views = require('koa-views'); const path = require('path'); const app = new Koa(); // 配置模板引擎 app.use(views(path.join(__dirname, './views'), { extension: 'ejs' // 指定模板文件的扩展名 })); // 其他中间件和设置 app.listen(3000, () => { console.log('Server is running on port 3000'); });
创建模板文件:
在项目文件夹中,创建一个名为
views
的文件夹。在此文件夹中,创建一个名为index.ejs
的模板文件,并添加一些基本的 HTML 代码:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My Koa App</title> </head> <body> <h1><%= message %></h1> </body> </html>
在 Koa 应用中渲染模板:
现在,你可以在 Koa 应用中创建一个路由,该路由将渲染你的模板文件。为此,你需要安装
koa-router
:npm install koa-router
或者
yarn add koa-router
接下来,在
app.js
中引入koa-router
,并创建一个路由,该路由将渲染index.ejs
模板:const Koa = require('koa'); const views = require('koa-views'); const Router = require('koa-router'); const path = require('path'); const app = new Koa(); const router = new Router(); // 配置模板引擎 app.use(views(path.join(__dirname, './views'), { extension: 'ejs' })); // 创建路由 router.get('/', async (ctx) => { await ctx.render('index', { message: 'Hello, Koa!' }); }); // 使用路由 app.use(router.routes()); app.use(router.allowedMethods()); app.listen(3000, () => { console.log('Server is running on port 3000'); });
现在,当你访问 http://localhost:3000
时,你应该看到 “Hello, Koa!” 消息。你可以根据需要修改模板文件和传递给模板的数据。