详解在express站点中使用ejs模板引擎

使用 vs创建的express站点，默认使用的是jade模板引擎，但是我不太喜欢这种方式，因为我觉得html本身的语义特性是我喜欢的，另外html本身也足够简洁，使用html自身做为模板语言更符合我的喜好，所以我选择ejs。

1、安装

在网站根目录启动控制台，输入

npm install ejs

程序包会安装到node_modules目录下。

2 修改APP.JS

修改app.js 将view engine修改为ejs。（并将模板的后缀修改为.html）

 app.set('views',path.join(__dirname , 'views') );
 app.engine('.html', require('ejs').__express);
 app.set('view engine', 'html');

3 创建测试页面

在views文件夹中创建index.html，内容如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Pivotal Search</title>
  <meta name="description" content="">
  <meta name="author" content="">
  <!-- HTML5 shim, for IE6-8 support of HTML elements -->
  <!--[if lt IE 9]>
   <script src="http://apps.bdimg.com/libs/html5shiv/r29/html5.min.js"></script>
  <![endif]-->
  <!-- styles -->
  <link href="css/style.css" rel="external nofollow" rel="stylesheet">

</head>
<body>
    <%= title %>
</body>
</html>

然后在router里修改index.js:

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: '测试11111' });
});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • NodeJS框架Express的模板视图机制分析

    模板引擎 Express支持许多模板引擎,常用的有: haml 的实现Haml haml.js 接替者,同时也是Express的默认模板引擎Jade 嵌入JavaScript模板EJS 基于CoffeeScript的模板引擎CoffeeKup 的NodeJS版本jQuery模板引擎 视图渲染(view randering) 视图的文件名默认需遵循"<name>.<engine>"的形式,这里<engine>是要被加载的模块的名字.比如视图layout

  • node+express+ejs使用模版引擎做的一个示例demo

    node+express+ejs使用模版引擎做的一个示例demo

    什么是模板引擎 模板引擎(Template Engine)是一个将页面模板和要显示的数据结合起来生成 HTML 页面的工具.如果说上面讲到的 express 中的路由控制方法相当于 MVC 中的控制器的话,那模板引擎就相当于 MVC 中的视图. 模板引擎的功能是将页面模板和要显示的数据结合起来生成 HTML 页面.它既可以运 行在服务器端又可以运行在客户端,大多数时候它都在服务器端直接被解析为 HTML,解析完成后再传输给客户端,因此客户端甚至无法判断页面是否是模板引擎生成的.有时候模板引擎也可

  • Nodejs+express+ejs简单使用实例代码

    前几天主要看了express,今天开始接触ejs,jade还是不想看了,O(∩_∩)O哈哈~ var express = require("express"); var ejs = require('ejs'); //var fs = require("fs"); //var bodyParser = require('body-parser'); var app = express(); app.engine('html', ejs.renderFile); ap

  • nodejs 图解express+supervisor+ejs的用法(推荐)

    nodejs 图解express+supervisor+ejs的用法(推荐)

    通过node js自带的http模块搭建了一个简易的服务器,实际在开发中,一般用的是express框架,本文我们就来讲讲项目开发中必备不可少的几样东西: •服务器( express ) •路由( express.Router ) •模板引擎( ejs ) •当然再加上数据库,就可以完成一个mvc的web应用了,数据库的用法,后期我会写一个项目 一.首先,新建一个项目文件夹( ghostwu ),在命令行下切换到该目录,用npm init --yes 初始化package.json文件 安装exp

  • 详解在express站点中使用ejs模板引擎

    详解在express站点中使用ejs模板引擎

    使用 vs创建的express站点,默认使用的是jade模板引擎,但是我不太喜欢这种方式,因为我觉得html本身的语义特性是我喜欢的,另外html本身也足够简洁,使用html自身做为模板语言更符合我的喜好,所以我选择ejs. 1.安装 在网站根目录启动控制台,输入 npm install ejs 程序包会安装到node_modules目录下. 2 修改APP.JS 修改app.js 将view engine修改为ejs.(并将模板的后缀修改为.html) app.set('views',path

  • 详解在 Angular 项目中添加 clean-blog 模板

    详解在 Angular 项目中添加 clean-blog 模板

    在 Angular 项目中添加 clean-blog 模板 clean-blog 博客模板下载 clean-blog 或者在下面链接下载 startbootstrap-clean-blog-4-dev.zip 解压并拷贝 解压下载的文件,将所有文件拷贝到 assets/clean-blog 目录下 拷贝代码 将 clean-blog 的 index.html 内容拷贝到 app.component.html <!--The whole content below can be removed w

  • 详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎

    序言: Thymeleaf 是Java服务端的模板引擎,与传统的JSP不同,前者可以使用浏览器直接打开,因为可以忽略掉拓展属性,相当于打开原生页面,给前端人员也带来一定的便利.如果你已经厌倦了JSP+JSTL的组合,Thymeleaf或许是个不错的选择!本工程传送门:SpringBoot-Web-Thymeleaf 开始使用 1.引入依赖 SpringBoot默认提供了Thymeleaf的Starter,只需简单引入依赖即可. <dependency> <groupId>org.s

  • SpringMVC中使用Thymeleaf模板引擎实例代码

    本文研究的主要是SpringMVC中使用Thymeleaf模板引擎的相关内容,具体介绍如下. Thymeleaf提供了一组Spring集成,允许您将其用作Spring MVC应用程序中全面替代JSP的功能. Maven依赖 <!-- thymeleaf-spring4 --> <dependency> <groupId>org.thymeleaf</groupId> <artifactId>thymeleaf-spring4</artifa

  • 详解redis在nodejs中的应用

    redis是一个性能非常好的内存数据库,部署在应用程序和mysql数据中间做缓存数据库,可以极大的提升应用程序的性能,这里简单介绍nodejs客户端操作redis的demo程序 redis里面总共可以存储5种数据类型,分别是字符串,列表.集合.三列.有序集合:这里将会对这5种数据类型的增删查改一一处理: 1.redis在mac上的安装: https://redis.io/download,当前我用的版本稳定版本是4.0.9,解压之后,进入redis-4.0.9目录,执行make && su

  • 详解ASP.NET Core中配置监听URLs的五种方式

    默认情况下,ASP. NET Core应用会监听一下2个Url: http://localhost:5000 https://localhost:5001 在本篇博文中,我将展示如何使用五种不同的方式改变应用监听的URLs. 在ASP.NET Core项目启动时,有多种配置监听Url的方式,在我之前的一篇博客中,已经展示了在ASP.NET Core 1.0中如何应用不同的方式配置,在ASP.NET Core 3.x中,大部分方式还是一样的. UseUrls() - 在Program.cs配置程序

  • 详解Kotlin Android开发中的环境配置

    详解Kotlin Android开发中的环境配置

    详解Kotlin Android开发中的环境配置 在Android Studio上面进行安装插件 在Settings ->Plugins ->Browse repositores.. ->kotlin 安装完成后重启Android Studio就生效了 如图所示: 在Android Studio中做Kotlin相关配置 (1)在根目录 的build.gradle中进行配置使用,代码如下: buildscript { ext.kotlin_version = '1.1.2-4' repos

  • 详解Golang 与python中的字符串反转

    详解Golang 与python中的字符串反转 在go中,需要用rune来处理,因为涉及到中文或者一些字符ASCII编码大于255的. func main() { fmt.Println(reverse("Golang python")) } func reverse(src string) string { dst := []rune(src) len := len(dst) var result []rune result = make([]rune, 0) for i := le

  • 详解闭包解决jQuery中AJAX的外部变量问题

    详解闭包解决jQuery中AJAX的外部变量问题 在AJAX中,我们经常都要使用外部变量,经常会多次使用,如下代码 function getCarInfo(){ for(var i=0;i<4;i++){ var carId = $("#carList0"+i+" #carId").val(); var request = { city: city, carId: carId }; $.ajax({ url:"enquiry", type:

  • 详解微信小程序中的页面代码中的模板的封装

    详解微信小程序中的页面代码中的模板的封装 最近在进行微信小程序中的页面开发,其实在c++或者说是js中都会出现这种情况,就是相同的代码会反复出现,这就是进行一定的封装,封装的好处就是可以是程序中在于减少一定的代码量,并且可是使代码结构更加清晰.那今天所要记录的就是关于微信小程序中的页面的模板封装. 在微信小程序中的文件名都带有wxml等样式,在wxml中提供了模板,即可以在模板中定义代码片段,然后可以在页面中的不同位置进行调用,模板的定义: <templatename="products&

随机推荐