首页 > 其他分享 >koa、koa-router、nunjucks 综合案例

koa、koa-router、nunjucks 综合案例

时间:2024-04-05 15:45:43浏览次数:11  
标签:nunjucks render koa ctx Koa router

 

const Koa = require('koa');
const router = require('koa-router')();
const nunjucks = require('nunjucks');
const app = new Koa();
// 配置 Nunjucks
nunjucks.configure(__dirname + '/views', {
    autoescape: true, // 是否自动转义输出
    noCache: true // 是否禁用模板缓存,方便开发调试
});
// 将 Nunjucks 添加为 Koa 中间件
app.use(async (ctx, next) => {
    ctx.render = nunjucks.render;
    await next();
});
// 配置 router
router.get('/', async (ctx, next) => {
    ctx.body = await ctx.render('index.html', { title: 'Index page', content: 'Hello Index!' });
});
router.get('/post/:id.html', async (ctx, next) => {
    ctx.body = await ctx.render('post.html', { title: 'Post page', content: 'Hello Post!' });
});
// 将 router 添加为 Koa 中间件
app.use(router.routes());
app.listen(3000, () => {
    console.log('Server is running at http://localhost:3000');
});

 

标签:nunjucks,render,koa,ctx,Koa,router
From: https://www.cnblogs.com/yuyanc/p/18115806

相关文章

  • Vue Router
    VueRouter是Vue.js官方的路由管理器,它与Vue.js核心深度集成,使得构建单页面应用变得易如反掌。通过VueRouter,我们可以根据用户访问的不同路径,动态渲染出不同的组件,从而实现页面的切换和展示。VueRouter的功能非常强大,包括但不限于:嵌套路由映射:允许我们在一个路由中嵌套另......
  • Koa 处理静态文件
    Koa是一个基于Node.js的Web框架,它本身并不内置用于处理静态文件的功能,但你可以借助于Koa的中间件来处理静态文件。其中比较常用的是koa-static中间件。以下是使用Koa处理静态文件的简单示例:首先,你需要安装koa-static模块。你可以通过npm或者yarn安装:npmins......
  • nodejs中使用Nunjucks 模板引擎
    要在Koa2中使用Nunjucks模板引擎,你需要进行一些额外的设置。以下是一个示例代码,演示了如何在Koa2中集成Nunjucks:首先,确保已经安装了Koa和Nunjucks:npminstallkoanunjucks然后,在项目中创建一个名为app.js的文件,并添加以下代码:constKoa=require('koa');con......
  • Vue基础知识:声明式导航---导航链接router-link,router-link是什么,怎么用?router-link-ac
    router-link是什么?vue-router提供的一个全局组件,router-link(用于取代a标签)router-link怎么用?router-link的好处?1.能够跳转,能高亮(自带激活时的类名)1.能跳转,配置to属性指定路径(必须)。本质还是a标签,to不需要多加#既然已经有了a标签,为什么还有加一个router-link标签呢?......
  • Cisco IOS XRv 9000 Router IOS XR Software 24.1.1(ED) - 服务提供商边缘虚拟路由器
    CiscoIOSXRv9000RouterIOSXRSoftware24.1.1(ED)-服务提供商边缘虚拟路由器CiscoIOSXRv9000路由器请访问原文链接:https://sysin.org/blog/cisco-ios-xrv-9000/,查看最新版。原创作品,转载请保留出处。作者主页:sysin.org思科IOS-XR简介CiscoIOSXRv9000路由......
  • vue引入vue-router
    Vue路由(router)的安装和使用安装vue-router插件第一步:在CMD窗口中,使用命令跳转到vue的安装路径下第二步:输入命令:npmivue-router@3vue2要安装vue-router3npmivue-router@3vu3要安装vue-router4npmivue-router@4第三步:出现added1packagein2m表示安装成功vu......
  • React - React Router
    安装pnpmireact-router-dom布局布局组件用于定义应用程序的整体布局结构,决定如何将匹配的子路由渲染到指定的位置(通过<Outlet/>)。file:[src/layouts/index.js]import{Outlet,Link}from"react-router-dom";exportdefaultfunctionLayout(){return(<d......
  • Cisco ASR 1000 Router IOS XE Software Release Dublin-17.12.3 ED
    CiscoASR1000RouterIOSXESoftwareReleaseDublin-17.12.3EDCiscoASR1000SeriesAggregationServicesRouters请访问原文链接:https://sysin.org/blog/cisco-asr-1000/,查看最新版。原创作品,转载请保留出处。作者主页:sysin.org思科ASR1000系列聚合服务路由器Re......
  • vue-router
    [什么是vue-router]传统的路由是针对服务器不同文件,这样路由的变动就会导致新页面加载,导致页面刷新。vue-router实现了在vue组件基础上,不加载页面文件,而是更改部分页面组件的方式来展现不同路由时显示的内容。同时节约了客户端和服务端资源。[安装]npmivue-router@4......
  • router-link (3) pigx单体 路由跳转
    1.src/router下route.ts加入前端静态路由dynamicRoutes:这里是跳转后带菜单的 { path:'/pro/proProjectTaskAcceptance/index.vue', name:'项目验收', component:()=>import('/@/views/pro/proProjectTaskAcceptance/index.vue'), meta:{ i......