首先在项目文件夹下使用 cmd,输入:npm install --save art-template koa-template

art-template语法参考:http://aui.github.io/art-template/zh-cn/docs/syntax.html,同时也支持ejs模板语法

后端:

//koa-art-template模板引擎
const koa = require('koa');
var router = require('koa-router')();
var render = require('koa-art-template');
const static = require('koa-static');
const bodyParser = require('koa-bodyparser');
const session = require('koa-session'); var app = new koa();
app.use(static('./www'));
app.use(bodyParser());
var keys = [];
(()=>{
for(var i=0;i<1000;i++){
keys.push(Math.random()+100);
};
});
app.keys = keys;
app.use(session({
maxAge:1000,
keys:'koa:sess'
},app)); /*
render(app,{
root:'模板路径',
extname:'.art', //模板文件尾
debug: process.env.NODE_ENE !== 'production' //打印报错
});
*/
render(app,{
root:'views',
extname:'.art',
debug: process.env.NODE_ENV !== 'production'
}); router.get('/',async (ctx)=>{
await ctx.render('index');
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(80);

文件目录结构:

前端:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="">
</head>
<body>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="#">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<div style="width: 200px;height: 200px;background: black;"></div>
{{ '123' }}
<script src="" async defer></script>
</body>
</html>

效果:

koa2入门--09.art-template高速模板引擎的使用的更多相关文章

  1. art template前端模板引擎

    偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...

  2. 500 Lines or Less: A Template Engine(模板引擎)

    介绍: 多数项目都是包含很多的逻辑处理,只有少部分的文字文本处理.编程语言非常擅长这类项目.但是有一些项目只包含了少量的逻辑处理,大量的文本数据处理.对于这些任务,我们期望有一个工具能够很好的处理这些 ...

  3. template.js 模板引擎

    例子: html代码: <div id="box"></div> css代码: table{ border-collapse: collapse; text ...

  4. 浅谈 Web 中前后端模板引擎的使用

    前言 这篇文章本来不打算写的,实话说楼主对前端模板的认识还处在非常初级的阶段,但是为了整个 源码解读系列 的完整性,在深入 Underscore _.template 方法源码后,觉得还是有必要记下此 ...

  5. 基于Velocity开发自己的模板引擎

    Velocity是一个基于java的模板引擎(template engine).它同意不论什么人只简单的使用模板语言(template language)来引用由java代码定义的对象. 当Veloc ...

  6. .net 开源模板引擎jntemplate 实战演习:基础篇之入门

    一.简介 模板引擎是Web开发中非常重要的一环,它负责将页面上的动态内容呈现出最终的结果展现给前端用户,在asp.net mvc中,我们最熟悉的就是Razor了,作为官方的视图引擎(视图引擎不等同于模 ...

  7. Django基础,Day10 - template 模板引擎与路径设置

    作为一个Web框架,Django需要一个方便的方式来生成动态的HTML.最常见的方法依赖于模板.模板包含所需的HTML输出的静态部分以及一些特殊的语法描述如何插入动态内容. Django框架后端默认支 ...

  8. 模板引擎:ArtTemplate 使用入门和简单的使用

    下载地址:https://github.com/aui/artTemplate 快速上手请参考:https://github.com/aui/artTemplate 通过阅读artTemplate原文 ...

  9. Velocity模板引擎入门

    类似于PHP中的Smarty,Velocity是一个基于Java的模板引擎(template engine).它允许任何人仅仅简单的使用模板语言(template language)来引用由java代 ...

随机推荐

  1. c++11的新特性

    好奇心来源于下面的一段代码, 一个是unordered_map, 这是c++11新加的container. 另外还有unordered_set, unordered_multimap, unorder ...

  2. LeetCode110 Balanced Binary Tree

    Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...

  3. 罗列Python标准模块

    文本 1. string:通用字符串操作 2. re:正则表达式操作 3. difflib:差异计算工具 4. textwrap:文本填充 5. unicodedata:Unicode字符数据库 6. ...

  4. Flask学习之十三 日期和时间

    英文博客地址:http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-xiii-dates-and-times 中文翻译地址: ...

  5. zip解决杨辉三角问题

    杨辉三角原型: / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ / \ 实现: a = [1] while True: print(a) ...

  6. CNN网络改善的方法——池化

    一个能降低卷积金字塔中特征图的空间维度,目前为止,我们通过调整步幅,将滤镜每次移动几个像素.图1 从而降低特征图的尺寸.这是降低图像采样率的一种非常有效的方法. 图1 它移除了很多信息,如果我们不采用 ...

  7. 「HNOI2015」菜肴制作

    「HNOI2015」菜肴制作 这道题想到了其实还挺水的,一开始我直接用小根堆拓扑然后就爆0了,然后我又用十万个堆搜索,T30,还是xkl告诉我要倒着拓扑. 首先要建反图,对于入度为0的点,较小的点先输 ...

  8. H3C 路由器的作用

  9. JavaScript 拖曳和居中问题

    今天遇到了一个问题,是这样的,有一个div盒子,实现盒子居中,居中的样式是这样的见下 #box{ width:300px; height:150px; position:absolute; left: ...

  10. HDU 1875 最小生成树prim算法

    #include<iostream> #include<cstdio> #include<algorithm> #include<cmath> #inc ...