写在前面

由于Express升级到4.0,将ejs的用法忽略,改为用户自定义形式,所以要引入库index.js作为引擎,来支持ejs的模板引擎(点击下载)。

首先是建立一个名字叫nodeitem,引擎为ejs的express模板

$ express  -e nodeitem

$     cd nodeitem

自动安装所指定的依赖

$     npm install

$     ls

把index.js文件上传到expand_modules/ejs里面去,上传文件可安装lrzsz

$     tree  expand_modules/

$     vim  app.js

因为我使用的的express3,我的app.js不是入口文件,退出vim

$    cat package.json

我的入口文件是 ./bin/www,想要修改也不难,只需要在app.js文件里添加如下代码即可

 app.set("port",process.env.PORT || 3000);
  http.createServer(app).listen(app.get("port"),function (){
  console.log("this is"+app.get("port"));
  })

  $    node app.js

  建立模板

$     vim  app.js

//引入引擎
var engine = require("./expand_modules/ejs/index.js");
//改变中间量及参数
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.set("port",process.env.PORT || 2000);
app.use(favicon());
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded());
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(app.router);
//在app中调用engine函数改造引擎,模板引擎在显示层的名字叫layout.ejs
app.engine("ejs",engine);
app.locals._layoutFile="layout";
//路由控制w
app.get('/', routes.index);
app.get("/abc",routes.abc);
app.get("/u/:user",routes.user);
app.get("/post",routes.post)
app.get("/reg",routes.reg);
app.get("/doReg",routes.doReg);
app.get("/login",routes.login);
app.get("/doLogin",routes.doLogin);
app.get("/logout",routes.logout);
app.get('/users', users.list);

  路由选择

$     cd routes && vim index.js

  

  查看显示层

  $     cd views  &&  ls 

   $    vim layout.js

  ejs文件类似于html文件,只需要在html文件的<body>标签里面加入自己设置的模板元素即可。下面是一个例子,最关键的是要在<body>标签里面加入<%-body%>  为了显示原始HTML内容

 

  $     vim  login.ejs

   只需要把你想要添加到layout模板里面的html文件的<body>标签内容写入ejs文件即可   模板layout中<%-body%> 会自动解析为html,并予以显示。上面文件只是一个例子。

  写在最后

     ejs引擎书写方式特别像html,但是他有一个缺点就是不支持模板继承,想要模板继承可以使用jada引擎。要想知道两者更加详细的区别,这是飞机票

  

Express下ejs的视图模板引擎的建立的更多相关文章

  1. 【转】在Express项目中使用Handlebars模板引擎

    原文:http://fraserxu.me/2013/09/12/Using-Handlebarsjs-with-Expressjs/ 最近在用Expressjs做一个项目,前后端都用它来完成.自己之 ...

  2. Express开发实例(2) —— Jade模板引擎

    前一篇通过helloworld,简单介绍了Express中的开发,本篇继续深入的学习express的模板. 关于Jade的用法,网上有很多,本篇参考:Jade语法 安装相关模块 在实验代码前,应该先安 ...

  3. 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍

    动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...

  4. Express 中配置使用 art-template模板引擎

    art-template 官网 https://aui.github.io/art-template/ 安装: npm install --save art-template npm install ...

  5. 视图模板引擎——Vue【双向绑定】原理剖析

    首先我们来了解一下MVC.MVP.MVMM这三大架构模式在前端角度上的理解. MVC分别是 Model(模型).View(视图).Controller(控制器)三个模块.View(视图层)最主要完成前 ...

  6. express中ejs模板引擎

    1.在 app.js 中通过以下两个语句设置了 引擎类型 和页面模板的位置: app.set('views', __dirname + '/views'); app.set('view engine' ...

  7. 前端笔记之NodeJS(三)Express&ejs模板引擎&请求识别

    一.Express框架 1.1基本使用 创建http服务器特别麻烦,express框架解决了这个的问题. Express在node界的地位,就相当于jQuery在DOM界的地位.jQuery的核心就是 ...

  8. express搭建web服务器、路由、get、post请求、multer上传文件、EJS模板引擎的使用

    express官网 postman工具下载地址  multer的npm文档地址 express模板引擎怎么使用  地址:http://www.expressjs.com.cn/guide/using- ...

  9. Express全系列教程之(十一):渲染ejs模板引擎

    一.简介 相比于jade模板引擎,ejs对原HTML语言就未作出结构上的改变,只不过在其交互数据方面做出了些许修改,相比于jade更加简单易用.因此其学习成本是很低的.您也可参考ejs官网:https ...

随机推荐

  1. Maven报错Missing artifact jdk.tools:jdk.tools:jar:1.7

    1.eclipse中Maven项目的pom文件报错: 2.解决方法: 直接在pom.xml中加上一个依赖项目: <dependency>      <groupId>jdk.t ...

  2. 一进“dos”就自动进入上次的目录

    这个原来在别的地方发过,但是后来发现有bug,处理windows下带有空格的长文件夹会出错.因为原来那个帖子已经不能编辑了,所以修改后写在这里. 这里的“dos”,就是windows下的命令行窗口,所 ...

  3. WSGI 配置禁止反向DNS查找

    原文链接:https://opendev.org/starlingx/ha/src/commit/045a37c672a92f1412629a176f51183c88882e61/service-mg ...

  4. ubuntu apt 相关命令

    sudo apt-get update  更新源sudo apt-get install package 安装包sudo apt-get remove package 删除包sudo apt-cach ...

  5. openstack vnc 报1006的错误

    1.问题现象 创建完虚拟机以后,通过nova get-vnc-console命令,获取虚机的vnc连接地址,在浏览器中打开该连接,报1006错误 2.vnc的原理图 3.定位分析 1)分别在控制节点和 ...

  6. MySQL数据库根据一个或多个字段查询重复数据

    系统在开发测试过程中出现bug,比如并发操作没有处理好,数据库中往往会插入重复数据,这些脏数据经常会导致各种问题.bug可以修改,但是数据往往也要处理,处理SQL如下: 1.根据一个字段查找重复数据 ...

  7. CSS动画实例:3D立方体

    CSS3支持3D转换,与3D转换有关的属性有: transform:向元素应用 2D或3D 转换. transform-origin:改变被转换元素的位置. transform-style:规定被嵌套 ...

  8. Hadoop 2.6.1 集群安装配置教程

    集群环境: 192.168.56.10 master 192.168.56.11 slave1 192.168.56.12 slave2 下载安装包/拷贝安装包 # 存放路径: cd /usr/loc ...

  9. 区块链入门到实战(24)之以太坊(Ethereum) – 网络节点

    用途: 全节点:用于区块和交易的校验 轻节点:电子钱包 以太坊(Ethereum)网络是一个公共的区块链网络,网络中包含2种网络节点: 全节点 轻节点 全节点 包含了从初始区块开始的全部区块,这些区块 ...

  10. react+antd的todolist开发

    使用localStorage缓存在cookie里刷新不会充重置 参考链接 create-react-app入门教程https://www.jianshu.com/p/77bf3944b0f4 http ...