在线html转jade工具>>

注意:以下是在Windwo环境下

运行:

npm install jade

然后你的目录node_modules下将增加jade文件夹

app.js

var express = require("express");
var app = express(); //指定模板引擎
app.set("view engine", 'jade');  //指定模板位置
app.set('views', __dirname + '/views'); //利用模板文件home.jade渲染为html
app.get("/", function(req, res) {
res.render('home.jade', {
name: 'tinyphp'
});
}); var server = app.listen(3000, function() {
console.log("请在浏览器访问:http://localhost:3000/");
});

home.jade,模板写法可参考官方:http://naltatis.github.io/jade-syntax-docs/

doctype html
html
head
title my jade template
body
p Hi #{name}

node下app.js后,访问:http://localhost:3000/

上面不想手动创建文件夹和文件的,可以参考以下命令:

新建文件夹

mkdir views

新建文件

cd.>home.ejs

想必聪明的你会发现jade和ejs上调用过程是一样的,只是模板的写法不同。

拽此查看ejs的例子>>

express结合jade模板渲染HTML的更多相关文章

  1. express结合EJS模板渲染HTML

    注意:以下是在Windwo环境下 运行: npm install ejs 然后你的目录node_modules下将增加ejs文件夹 app.js var express = require(" ...

  2. Express框架之Jade模板引擎使用

    日期:2018-7-8  十月梦想  node.js  浏览:2952次  评论:0条 前段时间讲说了ejs模板引擎,提到了jade的效率等等问题!今天在这里简单提一下jade的使用方式!结合expr ...

  3. Express全系列教程之(十):jade模板引擎

    一.前言 随着前端业务的不断发展,页面交互逻辑的不断提高,让数据和界面实现分离渐渐被提了出来.JavaScript的MVC思想也流行了起来,在这种背景下,基于node.js的模板引擎也随之出现. 什么 ...

  4. nodejs学习(二) ---- express中使用模板引擎jade

    系列教程,上一节教程  express+nodejs快速创建一个项目 在创建一个项目后,views目录下的文件后缀为 .jade . 打开 index.jade,具体内容如下图(忽略 header.j ...

  5. 【nodejs笔记3】Express基本用法,和路由控制,和模板渲染ejs

    1. 路由控制的工作原理 //routes/index.js中的代码//访问主页时,调用ejs模板引擎,渲染index.ejs模板文件,生成静态页面,并显示在浏览器中.router.get('/', ...

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

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

  7. jade模板引擎学习笔记(WebsStorm9.0.3+ nodejs+express+jade)

    jade环境搭建 jade标签写法 jade注释 jade添加类名.id.属性 jade添加脚本,css jade变量 jade多行文本显示 jade流程代码:for,each,while jade流 ...

  8. express框架结合jade模板引擎使用

    在views文件夹里新建一个jade.jade文件作为模板: html head title 哈哈 body #box ul li 标题1 li 标题2 li 标题3 li 标题4 #aside 在j ...

  9. Jade 模板引擎使用

    在 Express 中调用 jade 模板引擎 jade 变量调用 if 判断 循环 Case 选择 在模板中调用其他语言 可重用的 jade 块 (Mixins) 模板包含 (Includes) 模 ...

随机推荐

  1. dev....把pivotgridview和chart一起导出

    首先~: 命名空间: using DevExpress.XtraPrinting;using DevExpress.XtraCharts.Native;using DevExpress.XtraPri ...

  2. P1968

    题目背景 此处省略maxint+1个数 题目描述 在以后的若干天里戴维将学习美元与德国马克的汇率.编写程序帮助戴维何时应买或卖马克或美元,使他从100美元开始,最后能获得最高可能的价值. 输入输出格式 ...

  3. 多路复用I/O模型select() 模型 代码实现

    多路复用I/O:  socket编程之select(),poll(),epoll() 代码: client.c #include <stdio.h> #include <sys/ty ...

  4. rabbitmq在centos7下安装

    知识预览 一. RabbitMQ队列 二. 事例 三.基于RabbitMQ的RPC 回到顶部 一. RabbitMQ队列 ? 1 2 3 4 5 #消息中间件 -消息队列   - 异步 提交的任务不需 ...

  5. hdu 2044-2050 递推专题

    总结一下做递推题的经验,一般都开成long long (别看项数少,随便就超了) 一般从第 i 项开始推其与前面项的关系(动态规划也是这样),而不是从第i 项推其与后面的项的关系. hdu2044:h ...

  6. 【转载】C++ typedef用法小结

    http://www.cnblogs.com/charley_yang/archive/2010/12/15/1907384.html 第一.四个用途 用途一: 定义一种类型的别名,而不只是简单的宏替 ...

  7. 虚拟机Visualbox安装CentOS

    选择安装CentOS系统 进入了安装界面,选择语言,并选择继续 安装的主界面 1.先选择日期时间,选择了亚洲,并选择上海,再点击左上角的完成按钮 2.再选择键盘,选择英文 3.选择语言为英语 4.选择 ...

  8. Python3 字典及三级菜单练习

    #!/usr/bin/env python3 # -*- coding: utf-8 -*- # Author;Tsukasa list_1 = { '广州':{ '越秀区':{ '五羊石像','镇海 ...

  9. ReentrantLock和ReentrantReadWriteLock对比

    本文系作者原创,转载请注明:https://www.cnblogs.com/yanfei1819/p/10314533.html ReentrantLock 一.简介 ReentrantLock重入锁 ...

  10. SCU - 4439 Vertex Cover (图的最小点覆盖集)

    Vertex Cover frog has a graph with \(n\) vertices \(v(1), v(2), \dots, v(n)\) and \(m\) edges \((v(a ...