express结合jade模板渲染HTML
注意:以下是在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上调用过程是一样的,只是模板的写法不同。
express结合jade模板渲染HTML的更多相关文章
- express结合EJS模板渲染HTML
注意:以下是在Windwo环境下 运行: npm install ejs 然后你的目录node_modules下将增加ejs文件夹 app.js var express = require(" ...
- Express框架之Jade模板引擎使用
日期:2018-7-8 十月梦想 node.js 浏览:2952次 评论:0条 前段时间讲说了ejs模板引擎,提到了jade的效率等等问题!今天在这里简单提一下jade的使用方式!结合expr ...
- Express全系列教程之(十):jade模板引擎
一.前言 随着前端业务的不断发展,页面交互逻辑的不断提高,让数据和界面实现分离渐渐被提了出来.JavaScript的MVC思想也流行了起来,在这种背景下,基于node.js的模板引擎也随之出现. 什么 ...
- nodejs学习(二) ---- express中使用模板引擎jade
系列教程,上一节教程 express+nodejs快速创建一个项目 在创建一个项目后,views目录下的文件后缀为 .jade . 打开 index.jade,具体内容如下图(忽略 header.j ...
- 【nodejs笔记3】Express基本用法,和路由控制,和模板渲染ejs
1. 路由控制的工作原理 //routes/index.js中的代码//访问主页时,调用ejs模板引擎,渲染index.ejs模板文件,生成静态页面,并显示在浏览器中.router.get('/', ...
- Express开发实例(2) —— Jade模板引擎
前一篇通过helloworld,简单介绍了Express中的开发,本篇继续深入的学习express的模板. 关于Jade的用法,网上有很多,本篇参考:Jade语法 安装相关模块 在实验代码前,应该先安 ...
- jade模板引擎学习笔记(WebsStorm9.0.3+ nodejs+express+jade)
jade环境搭建 jade标签写法 jade注释 jade添加类名.id.属性 jade添加脚本,css jade变量 jade多行文本显示 jade流程代码:for,each,while jade流 ...
- express框架结合jade模板引擎使用
在views文件夹里新建一个jade.jade文件作为模板: html head title 哈哈 body #box ul li 标题1 li 标题2 li 标题3 li 标题4 #aside 在j ...
- Jade 模板引擎使用
在 Express 中调用 jade 模板引擎 jade 变量调用 if 判断 循环 Case 选择 在模板中调用其他语言 可重用的 jade 块 (Mixins) 模板包含 (Includes) 模 ...
随机推荐
- sicily 1016. 排队接水--课程作业
1016. 排队接水 Time Limi ...
- HDU 6146 Pokémon GO DP,计数
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6146 题意:~ 解法:原题..http://blog.csdn.net/y990041769/arti ...
- 【LabVIEW技巧】LabVIEW OOP怎么学
前言 有很多人对LabVIEW OOP存在比较极端的看法,大致分为两类: 1. 绝对否定派认为LabVIEW OOP只不过是LabVIEW为了追求时髦,在面向过程的基础上用簇做了一些特性,实际上完全不 ...
- Android UI 设计:pixel dip dpi sp density
1. px (pixels)像素 – 是像素,就是屏幕上实际的像素点单位. dip或dp (device independent pixels)设备独立像素,与设备屏幕有关. sp (scaled p ...
- java的collection集合
# 原创,转载请先留言 1.集合的由来 数组的长度是固定的,当需要增加或减少元素时需要对数组重新定义,太麻烦了.java内部给我们提供了集合类,能存储任意对象,长度可以改变的,随着元素的增加而增加,随 ...
- CountDownLatch源码浅析
Cmd Markdown链接 CountDownLatch源码浅析 参考好文: JDK1.8源码分析之CountDownLatch(五) Java并发之CountDownLatch源码分析 Count ...
- 用vue-cli来搭建vue项目和webpack
vue-cli 用vue-cli来搭建vue项目 第一步:全局安装vue-cli sudo npm install vue-cli -g 第二步:初始化一个项目 vue init webpack-si ...
- Flask 知识总结
阅读目录 第一篇:Flask基础知识介绍 第二篇:Flask扩展小结 第三篇:Flask 配置文件 第四篇:ORM.MySQL数据库连接池 第五篇:单例模式.蓝图Blueprint 第六篇:SQLAL ...
- 树莓派使用opencv
安装 reference1 reference2 注意 安装顺利,但是使用的时候提示 you need install libgtk2.0-dev xxx ,这时候说明你安装的库的顺序不对,你应该先安 ...
- [转载] 更改pip源至国内镜像,显著提升下载速度
原文地址: https://blog.csdn.net/lambert310/article/details/52412059 经常在使用python的时候需要安装各种模块,而pip是很强大的模块安装 ...